
@import url("https://fonts.googleapis.com/css?family=Lato");
@charset "UTF-8";
body{
	position : relative;
}
@media screen and (max-width: 768px){
	body{
		overflow-x : hidden;
	}
    .is-pc{
        display: none;
    }
}
@media print,screen and (min-width: 769px){
    .is-sp{
        display: none;
    }
}

.wrap{
	margin-left : auto;
	margin-right : auto;
}
/*--------------------------------------------
HEADER
---------------------------------------------*/
#header{
	position : fixed;
	top : 0;
	left : 0;
	width : 100%;
	z-index : 10;
}
#header h1 a{
	display : flex;
	align-items : center;
}
#header h1 .logo img{
	width : auto;
	max-width : inherit;
}
#header .name{
	letter-spacing : .06em;
}
@media screen and (max-width: 768px){
	#header .wrap{
		display : flex;
		align-items : center;
	}
	#header .name{
		font-size : calc( 40 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 769px){
	#header .wrap{
		display : flex;
		align-items : flex-start;
		justify-content : space-between;
		justify-content : space-between;
		align-items : center;
        width: 100%;
        max-width: 1600px;
	}
	#header .name{
		font-size : 24px;
	}
}
/*--------------------------------------------
MENU BUTTON
---------------------------------------------*/
@media screen and (max-width: 768px){
	body.is-open{
		overflow : hidden;
	}
	body.is-open [data-aos^=fade]{
		opacity : 1!important;
	}
	body.is-open #nav{
		max-height : 100vh;
	}
	#menuBth span span:nth-of-type(2){
		transform-origin : center center;
	}
	#menuBth span span:nth-of-type(3){
		transform-origin : center center;
	}
	body.is-open #menuBtn span{
		overflow : hidden;
	}
	body.is-open #menuBtn span span:nth-of-type(1){
		transform : translateY( calc( 10 * 100vw / 768 ) ) scale(0);
	}
	body.is-open #menuBtn span span:nth-of-type(2){
		transform : rotate(-45deg);
	}
	body.is-open #menuBtn span span:nth-of-type(3){
		transform : rotate(45deg);
	}
	body.is-open #menuBtn span span:nth-of-type(4){
		transform : translateY( calc( -10 * 100vw / 768 ) ) scale(0);
	}
	@media (-ms-high-contrast:none){
		body.is-open #menuBtn span span:nth-of-type(1){
			transform : translateY( 10px ) scale(0);
		}
		body.is-open #menuBtn span span:nth-of-type(4){
			transform : translateY( -10px ) scale(0);
		}
	}
}
#menuBtn{
	position : absolute;
	display : block;
}
#menuBtn > span{
	width : 100%;
	height : 100%;
	position : relative;
	display : block;
}
#menuBtn span span{
	position : absolute;
	width : 100%;
	display : block;
	transition : transform .3s ease;
}
#menuBtn span span:nth-of-type(1){
	top : 0;
}
#menuBtn span span:nth-of-type(4){
	bottom : 0;
}
@media screen and (max-width: 768px){
	#menuBtn{
		top : calc( 31 * 100vw / 768 );
		right : calc( 24 * 100% / 768 );
		width : calc( 80 * 100vw / 768 );
		height : calc( 48 * 100vw / 768 );
	}
	#menuBtn span span{
		height : calc( 8 * 100vw / 768 );
	}
	#menuBtn span span:nth-of-type(2) , #menuBtn span span:nth-of-type(3){
		top : calc( 20 * 100vw / 768 );
	}
}
/*--------------------------------------------
NAV
---------------------------------------------*/
@media screen and (max-width: 768px){
	#nav{
		position : fixed;
		left : 0;
		width : 100%;
		z-index : 10;
		transition : max-height .5s ease-in;
		max-height : 0;
		overflow : hidden;
		overflow-y : scroll;
	}
	#nav .scroll{
		padding-top : calc( 4 * 100vw / 768 );
		padding-bottom : calc( 139 * 100vw / 768 );
	}
	#nav #closeBtn{
		margin-left : auto;
		margin-right : auto;
		text-align : center;
		display : block;
		margin-top : calc( 73 * 100vw / 768 );
	}
	#nav #closeBtn img{
		width : auto;
		height : calc( 111 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 769px){
	#nav .scroll{
		margin-left : auto;
		margin-right : auto;
	}
}
@media screen and (max-width: 768px){
	#global-navigation li{
		border-bottom : calc( 3 * 100vw / 768 ) solid #fff;
	}
	#global-navigation a{
		font-size : calc( 28 * 100vw / 768 );
		display : flex;
		align-items : center;
		height : calc( 108 * 100vw / 768 );
		padding-left : calc( 16 * 100% / 720 );
		padding-right : calc( 16 * 100% / 720 );
	}
}
@media print,screen and (min-width: 769px){
	#global-navigation{
		width : 100%;
		display : flex;
		height : 50px;
		padding-top : 8px;
		padding-bottom : 8px;
	}
	#global-navigation li{
		flex-grow : 1;
		border-right : solid 1px #ccc;
	}
	#global-navigation li:first-child{
		border-left : solid 1px #ccc;
	}
	#global-navigation a{
		display : flex;
		align-items : center;
		justify-content : center;
		text-align : center;
		width : 100%;
		height : 100%;
		font-size : 14px;
	}
}
#side-navigation .cv{
	letter-spacing : .04em;
	display : flex;
	align-items : center;
	justify-content : center;
	text-align : center;
}
#side-navigation .sns{
	display : flex;
	align-items : center;
	justify-content : center;
}
#side-navigation .sns a{
	display : block;
	border-radius : 50%;
}
#side-navigation .sns a img{
	width : 100%;
	height : auto;
}
@media screen and (max-width: 768px){
	#side-navigation{
		margin-top : calc( 40 * 100vw / 768 );
	}
	#side-navigation .cv{
		width : 100%;
		height : calc( 128 * 100vw / 768 );
		font-size : calc( 30 * 100vw / 768 );
	}
	#side-navigation .sns{
		margin-top : calc( 32 * 100vw / 768 );
	}
	#side-navigation .sns li + li{
		margin-left : calc( 33 * 100vw / 768 );
	}
	#side-navigation .sns a{
		width : calc( 120 * 100vw / 768 );
		height : calc( 120 * 100vw / 768 );
		background-color : rgba(0,0,0,.4);
	}
}
@media print,screen and (min-width: 769px){
	#side-navigation{
		position : absolute;
		right: 0px;
		height : 85px;
		top : 0;
		display : flex;
		align-items : center;
		flex-direction : row-reverse;
	}
	#side-navigation .sns li + li{
		margin-left : 7px;
	}
	#side-navigation .sns a{
		width : 40px;
		height : 40px;
	}
	#side-navigation .cv{
		margin-left : 17px;
		width : 178px;
		height : 43px;
		font-size : 16px;
	}
}
/*--------------------------------------------
TO TOP
---------------------------------------------*/
#toTop{
	backface-visibility : hidden;
	will-change : position;
	display : flex;
	align-items : center;
	justify-content : center;
	text-align : center;
	position : fixed;
	bottom : 10px;
	z-index : 10;
}
#toTop.is-absolute{
	position : absolute;
	bottom : inherit;
	top : 0;
}
@media screen and (max-width: 768px){
	#toTop{
		right : calc( 10 * 100% / 768 );
		height : calc( 100 * 100vw / 768 );
		width : calc( 100 * 100% / 768 );
		background-color : rgba(0,0,0,.7);
		font-size : calc( 22 * 100vw / 768 );
		color : #f9fcff;
	}
}
@media print,screen and (min-width: 769px){
	#toTop{
		width : 31px;
		height : 31px;
		background-color : #ccc;
		font-size : 14px;
		color : #000;
		left : calc( 50% + 498px );
	}
	#toTop.is-absolute{
		top : 3px;
	}
}
/*--------------------------------------------
FOOTER
---------------------------------------------*/
#footer{
	position : relative;
}
#footer p{
	font-family : "Lato", sans-serif;
	text-align : center;
	letter-spacing : .1em;
	line-height : 1.1;
}
@media screen and (max-width: 768px){
	#footer{
		font-size : calc( 26 * 100vw / 768 );
	}
	#footer .wrap{
		padding-top : calc( 60 * 100vw / 768 );
		padding-bottom : calc( 60 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 769px){
	#footer{
		font-size : 13px;
	}
	#footer .wrap{
		padding-top : 36px;
		padding-bottom : 36px;
	}
}
/*--------------------------------------------
COMPONENT HEADER
---------------------------------------------*/
.component-header{
	color : #fff;
	text-align : center;
}
.component-header .title span{
	display : block;
}
.component-header .title span:nth-of-type(2){
	font-family : "Lato", sans-serif;
}
@media screen and (max-width: 768px){
	.component-header{
		background-image : url("../images/component/header/bg_sp.png");
		background-repeat : no-repeat;
		background-position : center top;
		background-size : cover;
	}
	.component-header .wrap{
		height : calc( 190 * 100vw / 768 );
		padding-top : calc( 59 * 100vw / 768 );
	}
	.component-header .title span:nth-of-type(1){
		font-size : calc( 50 * 100vw / 768 );
	}
	.component-header span:nth-of-type(2){
		font-size : calc( 22 * 100vw / 768 );
		margin-top : calc( 30 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 769px){
	.component-header{
		background-image : url("../images/component/header/bg.png");
		background-repeat : no-repeat;
		background-position : center top;
		background-size : cover;
	}
	.component-header .wrap{
		height : 180px;
		padding-top : 67px;
	}
	.component-header .title span:nth-of-type(1){
		font-size : 30px;
	}
	.component-header span:nth-of-type(2){
		font-size : 18px;
		margin-top : 35px;
	}
}
.component-flexbox .img{
	flex-shrink : 0;
}
@media screen and (max-width: 768px){
	.component-flexbox .img{
		text-align : center;
	}
}
@media print,screen and (min-width: 769px){
	.component-flexbox{
		display : flex;
		align-items : flex-start;
	}
	.component-flexbox.reverse{
		flex-direction : row-reverse;
	}
}
.component-center{
	text-align : center;
}
.component-list{
	display : flex;
	flex-wrap : wrap;
}
@media screen and (max-width: 768px){
	.component-list{
		justify-content : space-between;
	}
}
@media print,screen and (min-width: 769px){
	.component-list{
		justify-content : center;
	}
}

#footer_link {
}
@media screen and (max-width: 768px){
	#footer_link {
		text-align: center;
		padding: 0 0 calc( 30 * 100vw / 768 ) 0 ;
		font-size: calc( 24 * 100vw / 768 );
		line-height: 2;
	}
}
@media print,screen and (min-width: 769px){
	#footer_link {
		text-align: center;
		padding: 0 0 30px 0 ;
		font-size: 16px;
	}
}

.article-column3 {
}
    .article-column3 .column-content {
    }
@media screen and (max-width: 768px){
   .article-column3 {
    }
        .article-column3 .column-content {
            margin-bottom: calc( 60 * 100vw / 768 );
            width: 100%;
        }
            .article-column3 .column-content .img {
                margin-bottom: calc( 20 * 100vw / 768 );
            }
                .article-column3 .column-content .img img {
                    width: 100%;
                }
}
@media print,screen and (min-width: 769px){
    .article-column3 {
        display: flex;
        flex-wrap: wrap;
        grid-gap: 20px;
    }
        .article-column3 .column-content {
            width: calc(33% - 10px);
        }
            .article-column3 .column-content .img {
                margin-bottom: 10px;
            }
}




/*==================================================
アコーディオン
===================================*/

.faq dt , .faq dd{
	display : flex;
	align-items : flex-start;
}
.faq dt:before , .faq dd:before{
	font-family : "Teko", sans-serif;
	display : flex;
	align-items : center;
	justify-content : center;
	text-align : center;
	flex-shrink : 0;
}
.faq dt span , .faq dd span{
	font-weight : 500;
}
.faq dt:before{
	content : "Q";
	color : #2179c7;
}
.faq dt{
	background-color : #efefef;
	cursor : pointer;
	position : relative;
}
.faq dt:after{
	content : "";
	position : absolute;
	background-repeat : no-repeat;
	background-image : url("../images/ui/icon/plus.png");
	background-size : contain;
	background-position : center;
}
.faq dt span{
	line-height : 1.2;
}
.faq dd:before{
	content : "A";
	background-color : #2179c7;
	color : #fff;
}
@media screen and (max-width: 768px){
	.faq .wrap{
		padding-top : calc( ( 58 - 7 ) * 100vw / 768 );
		padding-bottom : calc( 6 * 100vw / 768 );
	}
	.faq .lede01{
		font-size : calc( 26 * 100vw / 768 );
		line-height : 1.54;
	}
	.faq dl{
		margin-top : calc( ( 50 - 7 ) * 100vw / 768 );
	}
	.faq dl > div + div{
		margin-top : calc( 10 * 100vw / 768 );
	}
	.faq dt:before , .faq dd:before{
		font-size : calc( 50 * 100vw / 768 );
	}
	.faq dt:before{
		width : calc( 80 * 100% / 720 );
		height : calc( 80 * 100vw / 768 );
		font-size : calc(  * 100vw / 768 );
	}
	.faq dt span{
		font-size : calc( 26 * 100vw / 768 );
		line-height : 1.2;
		margin-top : calc( ( 25 - 2.6 ) * 100vw / 768 );
		width : calc( 578 * 100% / 720 );
	}
	.faq dt:after{
		width : calc( 30 * 100% / 720 );
		height : calc( 30 * 100vw / 768 );
		right : calc( 21 * 100% / 720 );
		top : calc( 25 * 100vw / 768 );
	}
	.faq dt.is-open:after{
		background-image : url("../images/ui/icon/minus_sp.png");
	}
	.faq dd{
		margin-top : calc( 11 * 100vw / 768 );
		margin-bottom : calc( ( 35 - 7 ) * 100vw / 768 );
	}
	.faq dd:before{
		margin-left : calc( 14 * 100% / 720 );
		width : calc( 60 * 100% / 720 );
		height : calc( 60 * 100vw / 768 );
	}
	.faq dd span{
		padding-left : calc( 10 * 100% / 720 );
		font-size : calc( 26 * 100vw / 768 );
		line-height : 1.54;
		margin-top : calc( ( -1 - 7 ) * 100vw / 768 );
	}
}
@media print,screen and (min-width: 769px){
	.faq .wrap{
		padding-top : calc( 22px - 8px );
		padding-bottom : 60px;
	}
	.faq .lede01{
		font-size : 16px;
		line-height : 2;
		text-align : center;
	}
	.faq dl{
		margin-top : calc( 38px - 8px );
		margin-left : auto;
		margin-right : auto;
	}
	.faq dl > div + div{
		margin-top : 10px;
	}
	.faq dt:before , .faq dd:before{
		font-size : 40px;
		padding-top : 1px;
	}
	.faq dt span , .faq dd span{
		width : 717px;
	}
	.faq dt{
		background-position : right 20px center;
	}
	.faq dt:before{
		width : 60px;
		height : 60px;
	}
	.faq dt span{
		margin-top : calc( 19.2px - 1.8px );
		font-size : 18px;
		padding-left : 4px;
	}
	.faq dt:after{
		right : 20px;
		width : 20px;
		height : 20px;
		top : 20px;
	}
	.faq dt.is-open:after{
		background-image : url("../images/ui/icon/minus_pc.png");
	}
	.faq dd{
		margin-top : 11px;
		margin-bottom : calc( 26px - 7px );
	}
	.faq dd:before{
		width : 50px;
		height : 50px;
		margin-left : 5px;
	}
	.faq dd span{
		margin-top : calc( 2px - 7px );
		font-size : 16px;
		line-height : 1.88;
		padding-left : 9px;
	}
}

