<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/* ============================================================
PC
==============================================================*/
@media (min-width: 762px) {
    
    
	.yt_box{
		width: 100%;
		max-width: 880px;
		margin: 50px auto 0;
		padding: 0;
		box-sizing: border-box;
	}
	
	.yt_box .inner {
		padding-top: 56.25%;
		position: relative;
		height: 0;
		overflow: hidden;
	}
	
	.yt_box .inner iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
    /* ============================================================
 	main vi 
	==============================================================*/
    .floating{
        position: fixed;
        top: 120px;
        right: 30px;
        width: 200px;
        z-index: 2000;
        display: none;
    }
    .floating.is-hide{
        display: none!important;
    }
    .floating a{
        transition: all 0.3s;
    }
    .floating a:hover{
        opacity: 0.8;
    }
    .floating span{
        display: block;
        cursor: pointer;
        position: absolute;
        right: 0;
        top: 0;
        width: 25px;
        height: 25px;
        background: rgba(0,0,0,0.5);
        color: #fff;
        font-size: 20px;
        line-height: 27px;
        font-weight: bold;
        text-align: center;
    }
    .floating span em{
        font-style: normal!important;
    }
    #main_wrap {
        width: 100%;
        height: 88vh;
        position: relative;
        overflow: hidden;
    }
    #main_wrap .copy_wrap {
        position: absolute;
        top: 160px;
        left: 5%;
        z-index: 101;
    }
    #main_wrap .copy_wrap h1 {
        font-family: 'Noto Serif JP', serif;
        font-weight: 300;
        font-size: 2.8rem;
        color: #fff;
        line-height:100%;
        letter-spacing: 0.4rem;
    }
    #main_wrap .copy_wrap h1 span {
        display:inline-block;
        border:2px solid #fff;
        padding: 12px 36px 14px;
        margin: 0 16px 0 0;
    }
    #main_wrap .copy_wrap p.c_body {
    	font-family: 'Noto Sans JP', sans-serif;
    	font-weight: 400;
    	font-size: 1.6rem;
    	color: #fff;
    	letter-spacing: 0.3rem;
    	padding: 14px 0 18px;
    }
    #main_wrap .copy_wrap p.b_txt {
    	display:inline-block;
    	font-family: 'Noto Sans JP', sans-serif;
    	font-weight: 500;
        font-size: 1.6rem;
        color: #fff;
        letter-spacing: 0.2rem;
        position:relative;
        
    }

    #main_wrap .copy_wrap a{
    	display:block;
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #main_wrap .copy_wrap a:hover{
    	opacity:0.5;
    }

    #main_wrap .copy_wrap p.b_txt:before {
    	content: "";
    	display: block;
    	width: 20px;
    	height: 20px;
    	border:1px solid #fff;
    	border-radius:50%;
    	position: absolute;
    	top: 52%;
    	right: -30px;
    	transform:translate(0, -50%);
    }

    #main_wrap .copy_wrap p.b_txt:after {
    	content: "";
    	display: block;
    	width: 6px;
    	height: 6px;
    	border-right:solid 1px #fff;
    	border-bottom:solid 1px #fff;
    	position: absolute;
    	top: 52%;
    	right: -21px;
    	transform:translate(0, -50%) rotate(-45deg);
    }

    #main_wrap .m_copy{
    	width: 78vw;
    	max-width: 1000px;
    	position: absolute;
    	bottom: 44px;
    	left: 50%;
    	z-index:100;
    	transform:translate(-50%,0);
    }

    /* =========================================================================
 	#sec_mv_news
	===========================================================================*/
    
    #sec_mv_news{
        width: 100%;
        padding: 30px 0 25px;
        background: #f5f5f7;
    }

    #sec_mv_news .wrapper{
    	display:flex;
    }

    #sec_mv_news h2{
    	width: 120px;
    	font-family: 'Noto Serif JP', serif;
    	font-weight: 400;
    	font-size: 2.8rem;
    	color: #000;
    	text-align:right;
    	line-height: 100%;
    	letter-spacing:0.1rem;
    }

    #sec_mv_news h2:after{
    	content: "News";
    	display: block;
    	font-family: 'EB Garamond', serif;
    	font-weight: 600;
    	font-size: 1.6rem;
    	color:#ababab;
    	margin: 0 6px 0 0;
    }

    #sec_mv_news ul{
    	width: 750px;
    	position: absolute;
    	right: 0;
    	top: 47%;
    	transform:translate(0, -50%);
    	display:flex;
    }

    #sec_mv_news li:first-child a{
    	display:flex;
    }

    #sec_mv_news a time{
    	font-family: 'Noto Serif JP', serif;
    	font-weight: 400;
    	font-size: 1.4rem;
    	letter-spacing:0.2rem;
    	color:#ababab;
    	padding: 0 30px 0 0;
    }

    #sec_mv_news a h3{
    	font-family: 'Noto Sans JP', sans-serif;
    	font-weight: 400;
    	font-size: 1.4rem;
    	letter-spacing:0.2rem;
    	color:#000;
    	padding:0 40px 0 0;
    	transition: all 0.2s ease 0s;
    }

    #sec_mv_news a:hover h3{
    	color:#a407a8;
    }

    #sec_mv_news li:last-child a{
    	display:block;
    	font-family: 'Noto Sans JP', sans-serif;
    	font-weight: 500;
    	font-size: 1.4rem;
    	letter-spacing:0.2rem;



    	white-space: nowrap;
    	color:#4679c2;
    	position:relative;
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec_mv_news li:last-child a:hover{
    	transform: translate(10px,0);
    }

    #sec_mv_news li:last-child a:after{
    	content: "";
    	display: block;
    	width: 6px;
    	height: 6px;
    	border-right:solid 1px #4679c2;
    	border-bottom:solid 1px #4679c2;
    	position: absolute;
    	top: 50%;
    	right: -15px;
    	transform: translate(0, -50%) rotate(-45deg);
    }



    /* =========================================================================
 	#main_wrap scroll
	===========================================================================*/
	
	.scroll_wrap{
			z-index: 300;
			width: 50px;
			position: absolute;
			bottom: 20px;
			right: 30px;
	}

	.scroll_wrap a {
			display:block;
			font-family: 'EB Garamond', serif;
			font-weight: 600;
			font-size: 1.4rem;
			color: #000;
			letter-spacing:0.2rem;
	}

	.scroll_wrap a span{
			display: block;
			width: 1px;
			background: rgba(0,0,0,0.5);
			padding: 54px 0;
			margin: 0 0 0 22px;
			text-align: center;
			position: relative;
	}
		
	.scroll_wrap a span:before {
  			position: absolute;
  			top: 5px;
  			right: -2px;
  			content:"";
  			width: 5px;
  			height: 5px;
  			border-radius: 50%;
  			background-color: #000000;
  			animation: sdb 3s infinite;
  	}


    /* ============================================================
 	main vi swiper
	==============================================================*/
    #main_wrap .swiper_bg {
        position: absolute;
        left: 0;
        top: 0;
        width: 100vw;
        height: 100vh;
        transition: all 32s cubic-bezier(0.38, 0.36, 0.6, 0.6) 0s;
        transform: scale(1);
    }
    #main_wrap .notransition {
        transition: none !important;

        transform: scale(1) rotate(0.001deg) !important;
    }
    #main_wrap .swiper-slide-active .swiper_bg {
        transform: scale(1.26) rotate(0.001deg);
    }
    #main_wrap .swiper-slide-prev .swiper_bg {
        transform: scale(2) rotate(0.001deg);
    }
    #main_wrap .bgi01 {
        background: url("../img/bg01.jpg") no-repeat center;
        background-size: cover;
    }


    /* ============================================================
 	sec01
 	===============================================================*/
    
    #sec01 {
    	width:100%;
    	margin: 80px 0;
    	position:relative;
    }

    #sec01:before{
    	content: "";
    	display: block;
    	width:calc(50vw + 560px);
    	height: 100%;
    	background:#f4f4f6;
    	position: absolute;
    	top: 50px;
    	left:calc(50vw - 560px);
    }

    #sec01 .wrapper{
    	/* overflow:hidden; */
    	width:calc(50vw + 500px);
    	margin:0 0 0 auto;
    }

    #sec01 h2{
    	font-family: 'EB Garamond', serif;
		font-weight: 500;
		font-size: 5.0rem;
		color: #000;
		letter-spacing:0.2rem;
		position:relative;
    }

    #sec01 h2 span{
    	display:inline-block;
    	width:56px;
    	position:absolute;
    	left: -66px;
    	top: -18px;
    }

    

    #sec01 h3{
    	width:90%;
    	font-family: 'Noto Serif JP', serif;
    	font-weight: 600;
    	font-size: 2.0rem;
    	color: #000;
    	letter-spacing: 0.1rem;
    	position:relative;
    	background:#f4f4f6;
    	padding: 15px 0 15px 5px;
    	margin: -50px 0 16px -2px;
    	border-bottom: 1px #ccc dashed;
    }

    #sec01 h3:before{
    	content: "";
    	display: block;
    	width: 6px;
    	height:6px;
    	border-right:solid 1px #000;
    	border-bottom:solid 1px #000;
    	position: absolute;
    	top: 50%;
    	right: 15px;
    	transform:translate(0, -50%) rotate(-45deg);
    }

    #sec01 h4{
    	width:94%;
    	font-family: 'Noto Sans JP', sans-serif;
    	font-weight: 400;
    	font-size: 1.6rem;
    	color: #000;
    	letter-spacing: 0.05rem;
    	position:relative;
    	background:#f4f4f6;
    	padding:0 0 10px;
    }

    #sec01 p{
    	width:90%;
    	font-size: 1.4rem;
    	color: #000;
    	letter-spacing: 0.1rem;
    	position:relative;
    	background:#f4f4f6;
    	padding:0 0 10px;
    }

    #sec01 .swiper-container_product{
    	overflow-x:hidden;
    	margin:16px 0 0;
    }

    #sec01 .swiper-container_product a{
    	display:block;
    	background:#f4f4f6;
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec01 .swiper-container_product a:hover{
    	transform: translate(0,-20px);
    	opacity:0.5;
    }


    #sec01 .swiper-button-next_products{
    	width:40px;
    	height:150px;
    	line-height: 0;
    	background:#f4f4f6;
    	cursor:pointer;
    	position:absolute;
    	right:0;
    	top: 163px;
    	z-index: 100;
    }

    #sec01 .swiper-button-next_products img{
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec01 .swiper-button-next_products:hover img{
    	opacity:0.5;
    }


    #sec01 .more_btn a{
    	display:block;
    	width: 146px;
    	font-family: 'Noto Sans JP', sans-serif;
    	font-weight: 500;
    	font-size: 1.4rem;
    	letter-spacing:0.2rem;
    	color:#4679c2;
    	position:relative;
    	margin: 0 calc(50vw - 500px) 0 auto;
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec01 .more_btn a:hover{
    	transform: translate(10px,0);
    }

    #sec01 .more_btn a:after{
    	content: "";
    	display: block;
    	width: 6px;
    	height: 6px;
    	border-right:solid 1px #4679c2;
    	border-bottom:solid 1px #4679c2;
    	position: absolute;
    	top: 50%;
    	right: 0;
    	transform: translate(0, -50%) rotate(-45deg);
    }


    /* ============================================================
 	sec02
 	===============================================================*/
    
    #sec02 {
    	width:100%;
    	margin: 140px 0 80px;
    }


    #sec02 h2{
    	font-family: 'EB Garamond', serif;
		font-weight: 500;
		font-size: 5.0rem;
		color: #000;
		letter-spacing:0.2rem;
		position:relative;
    }

    #sec02 h2 span{
    	display:inline-block;
    	width:56px;
    	position:absolute;
    	left: -66px;
    	top: -18px;
    }

    #sec02 .f_wrap{
    	margin: 10px 0 0;
    	display:flex;
    	justify-content:space-between;
    }

    #sec02 .btn_big_wrap{
    	width:500px;
    }

    #sec02 .btn_big_wrap a{
    	display:block;
    	position:relative;
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec02 .btn_big_wrap a:hover{
     	opacity:0.5;
    }

    #sec02 .btn_big_wrap a .img_box{
    	line-height:0;
    	overflow: hidden;
    }

    #sec02 .btn_big_wrap a img{
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec02 .btn_big_wrap a:hover img{
    	transform: scale(1.1);
    }

    

    #sec02 .btn_big_wrap a span{
    	display:block;
    	font-family: 'Alata', sans-serif;
    	font-weight: 500;
    	font-size: 1.5rem;
    	color: #fff;
    	letter-spacing:0.2rem;
    	position:absolute;
    	top: 31px;
    	left: 38px;
    }

    #sec02 .btn_big_wrap a h3{
    	font-family: 'Noto Serif JP', serif;
    	font-weight: 600;
    	font-size: 3.4rem;
    	white-space: nowrap;
    	line-height: 140%;
    	color: #fff;
    	position:absolute;
    	top: 35%;
    	left: 50%;
    	transform: translate(-50%, -50%);
    	text-shadow: 0 0 5px #42382d;
    }

    #sec02 .btn_big_wrap a h4{
    	width:90%;
    	font-family: 'Noto Serif JP', serif;
    	font-weight: 600;
    	font-size: 2.2rem;
    	color: #000;
    	letter-spacing: 0.2rem;
    	position:relative;
    	background:#fff;
    	padding: 15px 0 15px 5px;
    	margin: -60px 0 0 -2px;
    }

    #sec02 .btn_big_wrap a h4:before{
    	content: "";
    	display: block;
    	width: 6px;
    	height:6px;
    	border-right:solid 1px #000;
    	border-bottom:solid 1px #000;
    	position: absolute;
    	top: 50%;
    	right: 15px;
    	transform:translate(0, -50%) rotate(-45deg);
    }

    #sec02 .btn_big_wrap a p{
    	width: 90%;
    	font-family: 'Noto Sans JP', sans-serif;
    	font-weight: 400;
    	font-size: 1.4rem;
    	color: #000;
    	letter-spacing: 0.2rem;
    	position:relative;
    	padding:0 0 0 5px;
    	margin:-10px 0 0;
    }

    #sec02 .btn_list_wrap{
    	width: 460px;
    }

    #sec02 .btn_list_wrap li{
    	margin: 0 0 20px;
    }
    #sec02 .btn_list_wrap a{
    	display:block;
    	position:relative;
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec02 .btn_list_wrap a:hover{
     	opacity:0.5;
    }

    #sec02 .btn_list_wrap a:before{
    	content: "";
		display: block;
		width: 6px;
		height:6px;
		border-right:solid 1px #000;
		border-bottom:solid 1px #000;
		position: absolute;
		top: 50%;
		right:0;
		transform:translate(0, -50%) rotate(-45deg);
    }


    #sec02 .btn_list_wrap .txt_wrap{
    	position: absolute;
    	top: 47%;
    	left: 162px;
    	transform:translate(0, -50%);
    }

    #sec02 .btn_list_wrap h3{
    	font-family: 'Noto Serif JP', serif;
    	font-weight: 400;
    	font-size: 2.0rem;
    	color:#000;
    	text-indent:-2px;
    }

    #sec02 .btn_list_wrap p{
    	font-family: 'Noto Sans JP', sans-serif;
    	font-weight: 300;
    	font-size: 1.4rem;
    	letter-spacing: 0.05rem;
    	line-height:160%;
    }

    #sec02 .btn_list_wrap a .img_box{
    	line-height:0;
    	overflow: hidden;
    	width: 140px;
    }

    #sec02 .btn_list_wrap a img{
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec02 .btn_list_wrap a:hover img{
    	transform: scale(1.1);
    }
    
    
    /* ============================================================
 	sec03
 	===============================================================*/
    
    #sec03 {
    	width:100%;
    	margin: 140px 0 0;
    	background: url("../img/bg_brand.jpg") no-repeat center;
    	background-size: cover;
    	position: relative;
    }
    
    #sec03:before{
        content: "";
        display: block;
        width:100%;
        height:100%;
        background: url("../img/wave_top.svg") no-repeat top center;
        background-size: 100% auto;
        position: absolute;
        top:0;
        left:0;
    }

    #sec03 .wrapper{
    	height: 530px;
    }


    #sec03 .txt_wrap{
    	position: absolute;
    	top: 45%;
    	left: 0;
    	transform:translate(0, -50%);
    }

    #sec03 h2{
    	font-family: 'EB Garamond', serif;
    	font-weight: 400;
    	font-size: 2.4rem;
    	letter-spacing:0.2rem;
    	padding:0 0 10px;
    	color:#fff;
    	text-indent:2px;
    }

    #sec03 h3{
    	font-family: 'Noto Serif JP', serif;
    	font-weight: 400;
    	font-size: 3.6rem;
    	color:#fff;
    	letter-spacing:0.4rem;
    	padding:0 0 20px;
    }

    /* ============================================================
 	sec04
 	===============================================================*/
    
    #sec04 {
    	width:100%;
    	margin: calc(-5vw) 0 0;
    	background: url("../img/bg_story.png") no-repeat top center;
    	background-size: cover;
    	position: relative;
    }
    
    #sec04:before{
        content: "";
        display: block;
        width:100%;
        height: 101%;
        background: url("../img/wave_bottom.svg") no-repeat bottom center;
        background-size: 100% auto;
        position: absolute;
        top:0;
        left:0;
    }

    #sec04 .wrapper{
    	height: 540px;
    }

    #sec04 .img_box1{
    	width:210px;
    	line-height:0;
    	position:absolute;
    	left:0;
    	bottom:0;
    }

    #sec04 .img_box2{
    	width:210px;
    	line-height:0;
    	position:absolute;
    	left:230px;
    	bottom:0;
    }


    #sec04 .txt_wrap{
    	position: absolute;
    	top: 54%;
    	right: 0;
    	transform:translate(0, -50%);
    	text-align:center;
    }

    #sec04 h2{
    	width:300px;
    	margin:0 auto 20px;
    	line-height:0;
    }

    #sec04 p{
    	font-family: 'Noto Serif JP', serif;
    	font-weight: 400;
    	font-size: 2.2rem;
    	text-align:center;
    	color:#000;
    	letter-spacing:0.2rem;
    	padding:0 0 40px;
    }

    /* ============================================================
 	sec05
 	===============================================================*/
    
    #sec05 {
    	width:100%;
    	margin: 120px 0 80px;
    }

    #sec05 &gt; ul{
    	display: flex;
    }

    #sec05 &gt; ul &gt; li{
    	width:50%;
    }

    #sec05 li a{
    	display:block;
    	height: calc(50vw / 820 * 468);
    	position:relative;
    }

    #sec05 li:first-child a{
    	background: url("../img/bnr_product.jpg") no-repeat center;
        background-size:cover;
        
    }

    #sec05 a:after{
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        background:#fff;
        position: absolute;
        top: 50%;
        left: 50%;
        transform:translate(-50%, -50%);
        opacity:0;
        transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec05 a:hover:after{
    	opacity:0.7;
    }
    

    
    #sec05 li:last-child a{
    	background: url("../img/bnr_as.jpg") no-repeat center;
        background-size:cover;
    }

    #sec05 h2{
    	font-family: 'Noto Serif JP', serif;
    	font-weight: 500;
    	font-size: 3.5rem;
    	color: #000;
    	letter-spacing:0.2rem;
    	position:relative;
    	padding: 0 0 10px;
    }

    #sec05 h2 span{
    	display:inline-block;
    	width:56px;
    	position:absolute;
    	left: -66px;
    	top: -8px;
    }

    #sec05 ul &gt; li:first-child h2{
    	width: 264px;
    	margin: 0 auto;
    }

    #sec05 ul &gt; li:last-child h2{
    	width: 340px;
    	margin: 0 auto;
    	letter-spacing: -0.1rem;
    	white-space: nowrap;
    }

    #sec05 .more_btn_c{
    	position:absolute;
    	bottom: 26px;
    	left: 50%;
    	transform:translate(-50%,0);
    	z-index:10;
    }
    
    #sec05 .more_btn_c li{
    	display:inline-block;
    	background:#fff;
    	font-family: 'Noto Sans JP', sans-serif;
    	font-weight: 400;
    	font-size: 1.4rem;
    	color:#4679c2;
    	line-height:100%;
    	padding: 12px 70px 15px 70px;
    	position:relative;
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec05 .more_btn_c li:after{
    	content: "";
		display: block;
		width: 7px;
		height:7px;
		border-right:solid 1px #4679c2;
		border-bottom:solid 1px #4679c2;
		position: absolute;
		top: 50%;
		right: 20px;
		transform:translate(0, -50%) rotate(-45deg);
		transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec05 a:hover .more_btn_c li{
    	color:#fff;
    	background:#4679c2;
    }
    #sec05 a:hover .more_btn_c li:after{
    	border-right:solid 1px #fff;
		border-bottom:solid 1px #fff;
		transform:translate(5px, -50%) rotate(-45deg);
    }

    /* ============================================================
    sec06
    ===============================================================*/
    
    #sec06 {
        width:100%;
        margin: 40px 0 80px;
    }

    #sec06 &gt; ul{
        display: flex;
    }

    #sec06 &gt; ul &gt; li{
        width:50%;
    }

    #sec06 li a{
        display:block;
        height: calc(50vw / 820 * 468);
        position:relative;
    }

    #sec06 li:first-child a{
        background: url("../img/bnr_product-so01.jpg") no-repeat center;
        background-size:cover;
        
    }

    #sec06 a:after{
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        background:#fff;
        position: absolute;
        top: 50%;
        left: 50%;
        transform:translate(-50%, -50%);
        opacity:0;
        transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec06 a:hover:after{
        opacity:0.7;
    }
    

    
    #sec06 li:last-child a{
        background: url("../img/bnr_product-so02.jpg") no-repeat center;
        background-size:cover;
    }

    #sec06 h2{
        font-family: 'Noto Serif JP', serif;
        font-weight: 500;
        font-size: 3.5rem;
        color: #000;
        letter-spacing:0.2rem;
        position:relative;
        padding: 0 0 10px;
    }

    #sec06 h2 span{
        display:inline-block;
        width:56px;
        position:absolute;
        left: -66px;
        top: -8px;
    }

    #sec06 h2{
        width: 264px;
        margin: 0 auto;
    }

    #sec06 .more_btn_c{
        position:absolute;
        bottom: 26px;
        left: 50%;
        transform:translate(-50%,0);
        z-index:10;
    }
    
    #sec06 .more_btn_c li{
        display:inline-block;
        background:#fff;
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: 1.4rem;
        color:#4679c2;
        line-height:100%;
        padding: 12px 70px 15px 70px;
        position:relative;
        transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec06 .more_btn_c li:after{
        content: "";
        display: block;
        width: 7px;
        height:7px;
        border-right:solid 1px #4679c2;
        border-bottom:solid 1px #4679c2;
        position: absolute;
        top: 50%;
        right: 20px;
        transform:translate(0, -50%) rotate(-45deg);
        transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec06 a:hover .more_btn_c li{
        color:#fff;
        background:#4679c2;
    }
    #sec06 a:hover .more_btn_c li:after{
        border-right:solid 1px #fff;
        border-bottom:solid 1px #fff;
        transform:translate(5px, -50%) rotate(-45deg);
    }


    /* ============================================================
 	sec07
 	===============================================================*/
    
    #sec07 {
    	width:100%;
    	margin: 120px 0 180px;
    }

    
    #sec07 h2{
    	font-family: 'Noto Serif JP', serif;
    	font-weight: 500;
    	font-size: 3.5rem;
    	color: #000;
    	letter-spacing:0.2rem;
    	position:relative;
    	padding: 0 0 10px;
    }

    #sec07 h2 span{
    	display:inline-block;
    	width:56px;
    	position:absolute;
    	left: -66px;
    	top: -8px;
    }

    #sec07 a{
    	display:block;
    	position:relative;
    	line-height:0;
    }
	#sec07 a:hover{
		opacity: 0.7;
	}
    #sec07 a:after{
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform:translate(-50%, -50%);
        opacity:0;
        transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec07 a:hover:after{
    	opacity:0.2;
    }

    #sec07 .more_btn_c{
    	position:absolute;
    	bottom: 26px;
    	right: 26px;
    	z-index:10;
    }
    
    #sec07 .more_btn_c li{
    	display:inline-block;
    	background:#fff;
    	font-family: 'Noto Sans JP', sans-serif;
    	font-weight: 400;
    	font-size: 1.4rem;
    	color:#4679c2;
    	line-height:100%;
    	padding: 12px 70px 15px 70px;
    	position:relative;
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec07 .more_btn_c li:after{
    	content: "";
		display: block;
		width: 7px;
		height:7px;
		border-right:solid 1px #4679c2;
		border-bottom:solid 1px #4679c2;
		position: absolute;
		top: 50%;
		right: 20px;
		transform:translate(0, -50%) rotate(-45deg);
		transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec07 a:hover .more_btn_c li{
    	color:#fff;
    	background:#4679c2;
    }
    #sec07 a:hover .more_btn_c li:after{
    	border-right:solid 1px #fff;
		border-bottom:solid 1px #fff;
		transform:translate(5px, -50%) rotate(-45deg);
    }
    
    
    /* ============================================================
 	sec_news
	==============================================================*/
    
    #sec_news {
    	width:100%;
    	margin: 120px 0 80px;
    }

    
    #sec_news h2{
    	font-family: 'Noto Serif JP', serif;
    	font-weight: 500;
    	font-size: 3.5rem;
    	color: #000;
    	letter-spacing:0.2rem;
    	position:relative;
    	padding: 0 0 10px;
    }

    #sec_news h2 span{
    	display:inline-block;
    	width:56px;
    	position:absolute;
    	left: -66px;
    	top: -8px;
    }

    #sec_news .more_btn{
    	position:absolute;
    	top:30px;
    	right: 21px;
    }

    #sec_news .more_btn a{
    	display:inline-block;
    	font-family: 'Noto Sans JP', sans-serif;
    	font-weight: 500;
    	font-size: 1.4rem;
    	letter-spacing:0.2rem;
    	color:#4679c2;
    	position:relative;
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    #sec_news .more_btn a:hover{
    	transform: translate(10px,0);
    }

    #sec_news .more_btn a:after{
    	content: "";
    	display: block;
    	width: 6px;
    	height: 6px;
    	border-right:solid 1px #4679c2;
    	border-bottom:solid 1px #4679c2;
    	position: absolute;
    	top: 50%;
    	right: -20px;
    	transform: translate(0, -50%) rotate(-45deg);
    }
	
	#sec_news{
		width: 100%;
		background: #fff;
		padding: 80px 0 60px;
		position: relative;
	}
	
	
	/* news navi start ---------------------- */
	#sec_news #news_btn_wrap{
		display: flex;
		justify-content:space-between;
		margin: 0 0 2px;
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
	}
	
	#sec_news #news_btn_wrap li{
		width: 25%;
	}
	
	#sec_news #news_btn_wrap a{
		display: block;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 500;
		text-align: center;
		font-size: 1.4rem;
		padding: 16px 0;
		position: relative;
		transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
	}

	
	/* anime s */
		#sec_news #news_btn_wrap a:before{
			content: "";
			display: block;
			width: 0;
			height: 3px;
			background:#000;
			position: absolute;
			bottom: 0;
			left: 50%;
			transform:translate(-50%, 0);
		}

		#sec_news #news_btn_wrap a:hover:before{
			transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
			width: 60%;
		}

		#sec_news #news_btn_wrap li.act a:before{
			width: 60%;
		}
	/* anime e */
	
	
	/* news navi end ---------------------- */
	
	
	/* news list start ---------------------- */


	#sec_news .news_wrap {
		min-height: 430px;
	}

	#sec_news .news_list{
	}
	#sec_news .news_list:before,
	#sec_news .news_list:after{
		content: "";
		width:220px;
		margin:0;
		padding: 0;
		height: 0px;
		overflow: hidden;
	}
	#sec_news .news_list:before{
		order: 1;
	}
	
	#sec_news .news_list &gt; li{
	}

	#sec_news .news_list a{
		display: flex;
		position: relative;
		border-bottom: 1px solid #e2e2e2;
		padding: 28px 0;
	}

	#sec_news .news_list a time{
		font-family: 'Noto Serif JP', serif;
		font-weight:400;
		letter-spacing:0.1rem;
		font-size:1.4rem;
		width: 265px;
		color:#848484;
	}
	
	#sec_news .news_list a p{
		font-family: 'Noto Sans JP', sans-serif;
		font-weight:400;
		letter-spacing:0.1rem;
		font-size:1.4rem;
		width: 735px;
		color:#000;
		padding: 0 20px 0 0;
	}
	

	#sec_news .news_list a h3{
		display:block;
		box-sizing: border-box;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight:300;
		text-align: center;
		font-size: 1.2rem;
		color:#fff;
		background:#787878;
		width: 150px;
		border-radius: 4px;
		padding: 4px 12px 5px;
		line-height:100%;
		position: absolute;
		top: 30px;
		left: 92px;
	}

	
	
	
	/* news list end ---------------------- */
	
	
	
    



    /* ============================================================
 	more_btn_c
 	===============================================================*/
    

    .more_btn_c a{
    	display:inline-block;
    	background:#fff;
    	font-family: 'Noto Sans JP', sans-serif;
    	font-weight: 400;
    	font-size: 1.4rem;
    	color:#4679c2;
    	line-height:100%;
    	padding: 12px 70px 15px 70px;
    	position:relative;
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    .more_btn_c a:after{
    	content: "";
		display: block;
		width: 7px;
		height:7px;
		border-right:solid 1px #4679c2;
		border-bottom:solid 1px #4679c2;
		position: absolute;
		top: 50%;
		right: 20px;
		transform:translate(0, -50%) rotate(-45deg);
		transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

    .more_btn_c a:hover{
    	color:#fff;
    	background:#4679c2;
    }
    .more_btn_c a:hover:after{
    	border-right:solid 1px #fff;
		border-bottom:solid 1px #fff;
		transform:translate(5px, -50%) rotate(-45deg);
    }
    
    /* ============================================================
 	sec_info
 	===============================================================*/
    
    
   #sec_info ul.e_btn_list a{
		width: 100%;
		height: 172px;
		position:relative;
		background-color: #4679c2;
	}
	

	#sec_info ul.e_btn_list a:hover{
		background-color:#7a9fd4;
	}

     #sec_info .wrapper{
     	width:100%
     }

     #sec_info ul.e_btn_list a{
         display: block;
         position: relative;
         transition: all 0.5s ease 0s;
     }
     
     #sec_info ul.e_btn_list a .icon_box{
     	position: absolute;
     	top: 35px;
     	left: 50%;
     	transform: translate(-50%, 0);
     }
     
     #sec_info ul.e_btn_list a .icon_box img{
     	width: 46px;
     }

	#sec_info .e_btn_list li a:hover .img_box img{
		opacity:0.5;
	}

    #sec_info ul.e_btn_list a h3{
         font-family: 'Noto Serif JP', sans-serif;
         font-weight: 400;
         font-size: 2.0rem;
         color: #fff;
         position: absolute;
         top: 95px;
         left: 50%;
         transform: translate(-50%, 0);
         transition: all 0.5s ease 0s;
    }

    


}</pre></body></html>