@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');
*{
	padding: 0;
	margin: 0;
	border:0;
	vertical-align:top;
}
html, body {
	-webkit-text-size-adjust: 100%;
	font-size: 62.5%;
	height: auto;
}
body {
	font-size: 1.5rem;
	font-family: 'Noto Sans JP',-apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic",'HiraKakuProN-W3' ,'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Verdana, Meiryo, sans-serif;
    font-weight: 400;
	padding: 0;
	margin: 0 auto;
	width:100%;
	color:#333;
	line-height:1.8;
	/*letter-spacing: 0.2rem;*/
}
img{
	width: 100%;
}
/*----------------------------------------


 link
 
 
----------------------------------------*/	
a {
  color: #333;
  text-decoration:none;
  border:none;
}
a.line{
	border-bottom: 1px solid #000;
	padding-bottom: 3px;
	box-shadow: none !important;
}
a.line:hover{
	opacity: 0.7;
}
a:hover {
    color: #2c2c51;
    text-decoration:none;
    transition: all .5s;
}
a img.hover {
transition: opacity 1s ease-out;
}
/*----------------------------------------


header


----------------------------------------*/
header{
	position: sticky;
	top:0;
	left: 0;
	padding: 25px 0;
	width: 100%;
	transition: all 0.5s cubic-bezier(0.76, 0.09, 0.215, 1);
	background: #fff;
	z-index: 1000;
}
header .logo{
	position: absolute;
	top:15px;
	left: 5%;
	width: 194px;
	margin-block-end:0;
	transition: all 0.5s;
	line-height: 1.0;
}
header .inner{
	position: relative;
	margin: 0 auto;
	width:96%;
	transition: all 0.5s;
}
header .gnav{
	display: flex;
	justify-content: flex-end;
	list-style: none;
	margin-right: 5%;
}
header .gnav li{
	font-size: 1.6rem;
	margin-right: 30px;
	font-weight: bold;
}
/*----------------------------------------


section


----------------------------------------*/
section .inner{
	max-width: 1100px;
	width: 90%;
	margin: 0 auto;
	padding: 100px 0;
}
/*----------------------------------------


title


----------------------------------------*/
.title{
	position: relative;
	font-size:4.3rem;
	text-align: center;
	margin-bottom: 80px;
	color: #35C0CC;
	letter-spacing: 0.2rem;
	line-height: 1.0;
}
.title span{
	display: block;
	font-size: 2.3rem;
	color: #778698;
	font-weight: 400;
	letter-spacing: 0rem;
	margin-bottom: 20px;
}
.contact_area .title{
	font-size:2.4rem;
	margin-bottom: 0;
}
.contact_area .title span{
	font-size: 1.4rem;
	margin-bottom: 10px;
}
/*----------------------------------------


.footer


----------------------------------------*/	
footer {
	width: 100%;
	background:#35C0CC;
	padding: 20px 0;
	color: #fff;
	font-size: 1.6rem;
	}
footer a{
	color: #fff;
	}
footer .inner {
	max-width: 900px;
	width: 90%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	}
footer .inner .logo{
	width: 160px;
	}
footer .inner .sns_area img{
	display: inline-block;
	margin-left: 10px;
	width: 40px;
	}
footer .inner ul{
	display: flex;
	margin-top: 30px;
	}
footer .inner ul li{
	border-left: 1px solid #fff;
	line-height: 1.0;
	}
footer .inner ul li:last-child{
	border-right: 1px solid #fff;
	}
footer .inner ul li a{
	padding: 0 15px;
	line-height: 1.0;
	}
footer .copy{
	text-align: center;
	font-size: 1.3rem;
	margin-top: 30px;
}
.iziModal {
    border-radius: 10px !important;
}

/*----------------------------------------


info_area


----------------------------------------*/
.info_area dl{
	display: flex;
	border-top:1px solid #dde9fe;
	align-items: center;
	width: 90%;
    max-width: 1100px;
	margin: 0 auto;
}
.info_area dl:last-of-type{
	border-bottom:1px solid #dde9fe;
}
.info_area dt{
	position: relative;
	padding: 30px 0;
	cursor: pointer;
	font-size: 1.8rem;
	font-weight: normal;
	width: 150px;
}
.info_area dd{
	position: relative;
	padding: 0 80px 0 0;
	font-size: 1.8rem;
	width: calc(100% - 150px);
}
.info_area dd::before{
	position: absolute;
	content: "";
	border-top:2px solid #35C0CC;
	border-right:2px solid #35C0CC;
	transform: rotate(45deg);
	right: 5px;
	top:50%;
	width: 18px;
	height: 18px;
	margin-top: -10px;
}
.info_area dd h3{
	font-weight: normal;
	margin-bottom: 0;
}
.info_area dd h3 a{
	padding: 10px 0;
	display: block;
	line-height: 1.4;
}

/*----------------------------------------


pagenation


----------------------------------------*/
.pagenation{
	margin-top: 50px;
	display: flex;
	justify-content: center;
}
.pagenation div{
	margin: 0 5px;
}
.pagenation div a,
.pagenation div.active{
	border:2px solid #eef1f9;
	background: #fff;
	border-radius: 5px;
	font-size: 1.2rem;
	width: 40px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.pagenation div a.hover,
.pagenation div.active{
	border:2px solid #4a72ee;
	background: #4a72ee;
	color: #fff;
}
/*----------------------------------------


list round


----------------------------------------*/
ul.non_style{
	list-style: none;
}
ul.disc{
	margin-left: 30px;
}
p span{
	vertical-align: baseline;
}
.round_wrap{
	border-radius: 10px;
}
/*----------------------------------------


color / border


----------------------------------------*/	
.co_white{
	color: #fff;
}
.co_black{
	color: #000;
}
.co_blue{
	color: #35C0CC;
}
.co_navy{
	color: #778698;
}
.co_gray{
	color: #707070;
}
.co_orange{
	color:#FD8500;
}
.bg_white{
	background: #fff;
}
.bg_blue{
	background: #35C0CC;
}
.bg_sky{
	background: #F4F6FA;
}
.marker{
    background: linear-gradient(transparent 70%, #ffdc1c 0%);
    display: inline;
    padding: 0 2px 0;
}
.line_bottom{
	border-bottom: 1px solid #35C0CC;
	padding-bottom: 5px;
}
.line_left{
	position: relative;
	padding-left: 30px;
}
.line_left::before{
	position: absolute;
	content: "";
	background: #35C0CC;
	width: 10px;
	height: 100%;
	left: 0;
	top:0;
	border-radius: 10px;
}
/*----------------------------------------


div_wrap


----------------------------------------*/
.wrap_div {
    position: relative;
	cursor: pointer;
}
.child_div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100%;
}
.wrap_div div,
.wrap_div p{
    transition: 0.2s;
}
.wrap_div:hover div,
.wrap_div:hover p{
    opacity:0.7;
}
/*----------------------------------------


flex


----------------------------------------*/
.col{
	display: flex !important;
}
.flex_justify_center{
	justify-content: center;
}
.flex_justify_between{
	justify-content: space-between;
}
.flex_justify_end{
	justify-content: flex-end;
}
.flex_align_center{
	align-items: center;
}
.margin_auto{
	margin-left: auto;
	margin-right: auto;
}
/*----------------------------------------


font


----------------------------------------*/
.txt_c{
	text-align: center;
}
.txt_l{
	text-align: left;
}
.txt_r{
	text-align: right;
}
.fo11{
	font-size: 1.1rem !important;
}
.fo12{
	font-size: 1.2rem !important;
}
.fo13{
	font-size: 1.3rem !important;
}
.fo14{
	font-size: 1.4rem !important;
}
.fo15{
	font-size: 1.5rem !important;
}
.fo16{
	font-size: 1.6rem !important;
}
.fo18{
	font-size: 1.8rem !important;
}
.fo20{
	font-size: 2.0rem !important;
}
.fo22{
	font-size: 2.2rem !important;
}
.fo24{
	font-size: 2.4rem !important;
}
.fo26{
	font-size: 2.6rem !important;
}
.fo28{
	font-size: 2.8rem !important;
}
.fo30{
	font-size: 3.0rem !important;
}
.fo38{
	font-size: 3.8rem !important;
}
.fo40{
	font-size: 4.0rem !important;
}
.fo45{
	font-size: 4.5rem !important;
}
.fo_normal{
	font-weight: 400;
}
.fo_bold{
	font-weight: 400 ;
}
.fo_black{
	font-weight: 400;
}
.lih15{
	line-height: 1.5 !important;
}
.lih20{
	line-height: 2.0 !important;
}
span{
	vertical-align:baseline;
}
/*.en_font{
	font-family: 'Inter', sans-serif;
	letter-spacing: 0;
}*/
.mt15{
	margin-top: 15px;
	display: block;
}

/*----------------------------------------


animation


----------------------------------------*/
@media screen { 
    .fadein{
        opacity : 0;
        transform : translate(0, 80px);
        transition : all 2.5s cubic-bezier(0.19, 1, 0.22, 1);
        }
	.fade{
        }
    .fadein_l{
		opacity: 0;
        transform : translate(100px , 0);
        }
    .fadein_r{
		opacity: 0;
        transform : translate(-100px , 0);
        }
    .fadein_t{
		opacity: 0;
        transform : translate(0, -100px);
        }
    .on.fadein{
        opacity : 1;
        transform : translate(0, 0);
        }
	.on.fade .fadein_t{
		opacity: 1;
	    transition : all 2.0s cubic-bezier(0.19, 1, 0.22, 1);
		transition-delay: 0.2s;
	    transform : translate(0, 0);
        }
	.on.fade .fadein_l{
		opacity: 1;
	    transition : all 2.0s cubic-bezier(0.19, 1, 0.22, 1);
		transition-delay: 0.2s;
	    transform : translate(0, 0);
        }
    .fadein_list li {
        opacity : 0;
        transform : translate(0, 50px) ;
        transition : all 3000ms cubic-bezier(0.19, 1, 0.22, 1);
        }
    .on_list.fadein_list li:nth-child(1) { animation:on_ac 0.5s ease-in-out 0.40s forwards; }
    .on_list.fadein_list li:nth-child(2) { animation:on_ac 0.5s ease-in-out 0.50s forwards; }
    .on_list.fadein_list li:nth-child(3) { animation:on_ac 0.5s ease-in-out 0.60s forwards; }
    .on_list.fadein_list li:nth-child(4) { animation:on_ac 0.5s ease-in-out 0.70s forwards; }
    .on_list.fadein_list li:nth-child(5) { animation:on_ac 0.5s ease-in-out 0.80s forwards; }
    .on_list.fadein_list li:nth-child(6) { animation:on_ac 0.5s ease-in-out 0.90s forwards; }
    .on_list.fadein_list li:nth-child(7) { animation:on_ac 0.5s ease-in-out 1.0s forwards; }
    .on_list.fadein_list li:nth-child(8) { animation:on_ac 0.5s ease-in-out 1.1s forwards; }

    .fade_txt,
	.fade_ico{
        opacity : 0;
        }
    .on .fade_txt{
        animation:fade_txt 1.0s cubic-bezier(0.19, 1, 0.22, 1)  0.65s forwards;
        }
    .on .fade_ico{
        animation:fade_ico 1.0s cubic-bezier(0.19, 1, 0.22, 1)  0.65s forwards;
        }
    .on .fade_txt.fade_txt01,
	.on .fade_ico.fade_ico01{
        animation-delay: 0.2s;
        }
    .on .fade_txt.fade_txt02,
	.on .fade_ico.fade_ico02{
        animation-delay: 0.4s;
        }
    .on .fade_txt.fade_txt03,
	.on .fade_ico.fade_ico03{
        animation-delay: 0.6s;
        }
    .on .fade_txt.fade_txt04,
	.on .fade_ico.fade_ico04{
        animation-delay: 0.8s;
        }
    .on .fade_txt.fade_txt05,
	.on .fade_ico.fade_ico05{
        animation-delay: 1.0s;
        }
    .on .fade_txt.fade_txt06,
	.on .fade_ico.fade_ico06{
        animation-delay: 1.2s;
        }
    .on .fade_txt.fade_txt07,
	.on .fade_ico.fade_ico07{
        animation-delay: 1.4s;
        }
    .on .fade_txt.fade_txt09,
	.on .fade_ico.fade_ico09{
        animation-delay: 1.8s;
        }
    .on .ac_zoom {
        animation:ef-zoom 1.0s cubic-bezier(0.19, 1, 0.22, 1)  3.0s forwards;
    }
    .on .ac_zoom01{
        animation-delay: 0.2s;
        }
    .on .ac_zoom02{
        animation-delay: 0.4s;
        }
    .on .ac_zoom03{
        animation-delay: 0.6s;
        }
    .on .ac_zoom04{
        animation-delay: 0.8s;
        }
    .on .ac_zoom05{
        animation-delay: 1.0s;
        }
}
@keyframes ef-zoom {
	0% {
		opacity: 0;
		transform: scale(0.8);}
	100% {
		opacity: 1;
		transform: scale(1);}
}
@keyframes on_ac {
	0% { transform:translate(0,50px); opacity:0; }
	100% { transform:translate(0,0); opacity:1; }
}

@keyframes fade_txt {
	0% { transform:translate(0, 30px); opacity:0; }
	100% { transform:translate(0,0); opacity:1; }
}
@keyframes fade_ico {
	0% {  transform:translate(-20px, 0); opacity:0; }
	100% {  transform:translate(0, 0); opacity:1;}
}
@media only screen and (min-width:1025px) {
    .sp{
        display:none !important;
    }
    .tablet{
        display:none !important;
    }
    .pc{
        display:block !important;
    }
}
@media only screen and (max-width:1200px) {
    .work_area ul li{
        width: 48%;
    }
}
@media only screen and (max-width:1024px) {
    .pc{
        display:none !important;
    }
    .sp{
        display:none !important;
    }
    .tablet{
        display:block !important;
    }
}
@media only screen and (max-width:1000px) {
    /*----------------------------------------


    .footer


    ----------------------------------------*/	
    footer {
        padding: 2.6666667vw 0;
        }
    footer .inner {
        display: block;
        }
    footer .inner .foot_logo{
        width: 25%;
		max-width: 160px;
        margin-bottom: 2vw;
        }
    footer .inner ul{
        display: flex;
		justify-content: center;
        margin: 2.66666667vw 0;
        }
    footer .inner ul li{
        margin:0  2vw;
        }
	footer .inner .copy {
        text-align: center;
    }
    .iziModal {
        border-radius: 10px !important;
    }
}
@media only screen and (max-width:750px) {
	body{
		font-size: 3.733333333vw;
	}
    a[href^="tel:"] {
        pointer-events: none;
    }
    .pc{
        display:none !important;
    }
    .tablet{
        display:none !important;
    }
    .sp{
        display:block !important;
    }
    /*----------------------------------------


    header


    ----------------------------------------*/
    header {
		padding-top: 10px;
    }
    header h1 {
        font-size: 2.933333333vw;
    }
    header .logo{
		width: 35%;
		max-width: 90px;
		margin-top: -0.7em;
    }
    header .inner{
        position: relative;
        padding: 0 0;
        width:92%;
    }
    header .logo svg {
        width: 90px;
    }
    /*----------------------------------------


    wrap


    ----------------------------------------*/
    main {
        width: 100%;
        margin-top: 0;
    }
    section .inner {
        width: 90%;
		margin: 0 auto;
    }
    /*----------------------------------------


    title


    ----------------------------------------*/
    .title{
        font-size:3.2vw;
        margin-bottom: 6.666666667vw;
		line-height: 1.4;
    }
    .title .en_font{
        font-size: 8vw;
		line-height: 1.4;
    }
    /*----------------------------------------


    .footer


    ----------------------------------------*/	
    footer {
        padding: 2.6666667vw 0;
        }
    footer .inner {
        display: block;
        }
	footer .foot_logo_area p{
		font-size: 2.933333333vw !important;
	}
    footer .inner .foot_logo{
        width: 25%;
		max-width: 160px;
        margin-bottom: 2vw;
        }
    footer .inner ul{
        display: flex;
		justify-content: center;
        margin: 2.66666667vw 0;
        }
    footer .inner ul li{
        margin:0  2vw;
        }
	footer .inner .copy {
        text-align: center;
    }
    .iziModal {
        border-radius: 10px !important;
    }
    /*----------------------------------------


    pagenation


    ----------------------------------------*/
    .pagenation{
        margin-top: 6.666666667vw;
        display: flex;
        justify-content: center;
    }
    .pagenation div{
        margin: 0 0.6666666vw;
    }
    .pagenation div a,
    .pagenation div.active{
        font-size: 3.2vw;
        width: 8vw;
        height: 8vw;
    }
    /*----------------------------------------


    font


    ----------------------------------------*/
    .fo11{
        font-size: 2.933333333vw !important;
    }
    .fo12{
        font-size: 3.2vw !important;
    }
    .fo13{
        font-size: 3.466666667vw !important;
    }
    .fo14{
        font-size: 3.733333333vw !important;
    }
    .fo15{
        font-size: 4vw !important;
    }
    .fo16{
        font-size: 4.266666667vw !important;
    }
    .fo18{
        font-size: calc(4.8vw * 0.95) !important;
    }
    .fo20{
        font-size: calc(5.333333333vw * 0.9) !important;
    }
    .fo22{
        font-size: calc(5.866666667vw * 0.9) !important;
    }
    .fo24{
        font-size: calc(6.4vw * 0.8) !important;
    }
    .fo26{
        font-size: calc(6.933333333vw * 0.8) !important;
    }
    .fo28{
        font-size: calc(7.466666667vw * 0.8) !important;
    }
    .fo30{
        font-size: calc(8vw * 0.8) !important;
    }
    .fo40{
        font-size: calc(10.66666667vw  * 0.8) !important;
    }
    .fo45{
        font-size: calc(12vw * 0.8) !important;
    }
    .mt15{
        margin-top: 2vw;
    }
}