/*
Theme Name: CAT Child
Version: 1.1
Template: cat-so01
*/

.font-big{font-size: 1.2em;}
.font-mini{font-size: 0.8em;}
.font-red{color: #ff0000;}

.cf7-acceptance{margin: 40px 0; text-align: center;}

/******* SCROLL *********/
html {
	scroll-snap-type: y proximity;
	scroll-padding-top: 120px;
 	scroll-behavior: smooth;
}

/******* HEADER *********/
#header{position: sticky; top: 0; left: 0; height: auto; background: rgb(255,255,255); background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(243,251,254,1) 41%, rgba(224,245,252,1) 59%, rgba(201,238,250,1) 75%, rgba(180,231,248,1) 100%);}
.header__inner{max-width: 1100px; margin: 0 auto; position: relative; justify-content: flex-end;}
.header__logo,
.header__logo img{max-width: 100%; max-height: 100%;}
.header__logo{position: absolute; top: 10px; left: 0;}
.header__cv{margin: 30px 0 0;}
.header__cv a{background-color: #376BBA; padding: 0.5em; font-size: 16px; font-weight: bold;}
.header__menu{width: 100%; justify-content: center;}
.header__menu-list{justify-content: center;}
.header__menu-list > li{width: 120px; padding: 0 1%; margin: 20px 0; text-align: center; line-height: 0.5;}
.header__menu-list > li:not(last-child){border-right: 1px solid #ddd;}

/******* FV *********/
.hero__inner{display: flex; flex-direction: row-reverse; align-items: center; max-width: 1100px; margin: 22px auto 56px; padding: 0;}
.hero__img,
.hero__content{width: 50%;}
.hero__img img{height: auto;}
.hero__content{padding-right: 1%; position: relative; bottom: auto; left: auto;}
.hero__main-text{margin-bottom: 60px; letter-spacing: 0.14em;}
.hero__sub-text{letter-spacing: 0.05em;}

/******* SEC02 *********/
.sec02__inner{max-width: 1100px; display: block; padding: 78px 0 58px;}
.sec02__content{width: 100%;}
.sec02__flex{display: flex; justify-content: center;}
.sec02__title{display: flex; flex-direction: column-reverse; justify-content: center; align-items: center; gap: 10px; margin-bottom: 0;}
.sec02__title h2{font-size: 32px;}
.sec02__title .sub-title{font-size: 20px; color: var(--main-color);}
.sec02__leadtext{margin: 40px 0 74px; text-align: center; font-size: 20px;}
.sec02__box{width: 46%;margin: 2%;padding: 5% 1%;border-radius: 10px;box-shadow: 0 0 10px #dddddd9c;position: relative;display: block;}
.sec02__box-icon{position: absolute; top: -90px; left: -30px;}
.sec02__box-title{text-align: center; font-size: 24px;}
.sec02__box-img{margin: 20px 0; text-align: center;}
.sec02__box-text{width: 80%; margin: 0 auto;}
.sec02__link{text-align: center;}
.sec02__link a{display: inline-block; max-width: 100%; border: 1px solid #000; padding: 0.75em 4em 0.75em 3em; font-weight: bold;}
.sec02__link a:before{content: "\f054"; font-family: "Font Awesome 6 Free"; font-weight: 900; color: #000; top: 52%; right: 1em; transform: translateY(-50%); font-size: 0.9em;}
.sec02__link a:hover:before{color: #888;}
.sec02__link a:after{display: none;}

/******* COMPANY *********/
#company{background-color: #fafafa;}
.company__inner{max-width: 1100px; margin: 0 auto; padding: 78px 0;}
.company__inner table{width: 100%; max-width: 670px; margin: 20px auto;}
.company__inner th{width: 24%; padding: 1em 0; text-align: left; font-weight: 400;}
.company__inner td{width: 76%; padding: 1em 0;}
.company__inner td ul{margin-left: 1.5em; list-style: disc;}
.company__inner td ul li:not(:last-child){margin-bottom: 1.5em;}

/******* SEC06 *********/
#sec06{background: rgb(100,185,154); background: linear-gradient(180deg, rgba(100,185,154,1) 0%, rgba(180,231,248,1) 100%); padding: 65px 0 37px;}
.sec06__img{width: 100%; max-width: 1100px; height: auto; margin: 0 auto;}
.sec06__img img{height: auto;}
#sec06 .sec02__title .sub-title{color: #fff;}
.sec06__inner{width: 596px;}
.sec06__text{background-color: rgba(255,255,255,0.3); margin: 16px 0; padding: 10%; border-radius: 30px; text-align: center; font-size: 20px;}
.sec06__btn-posi{margin-top: 33px;}
.sec06__btn{background-color: #E42115; border: none; padding: 0.5em 3em 0.6em; font-size: 18px; font-weight: bold; position: relative;}
.sec06__btn:hover{background-color: #E42115; color: #fff; opacity: 0.7;}
.sec06__btn:before{content: "\f054"; font-family: "Font Awesome 6 Free"; font-weight: 900; color: #fff; position: absolute; top: 52%; right: 1em; transform: translateY(-50%); font-size: 0.9em;}

/******* FOOTER *********/
.footer__logo{display: none;}
.footer__cp{background-color: transparent; color: var(--main-color);}

/******* PAGE *********/
.page__hero{margin-top: 8em;}
.page__hero h1{text-align: center; font-size: 32px;}

/******* SERVICE *********/
.service__sec01 .wp-block-column{background-color: #fff; padding: 5%; border-radius: 10px;box-shadow: 0 0 10px #dddddd9c;}
.page__inner .service__sec01 h2{margin-top: 0; border-left: none; color: var(--main-color); font-size: 24px;}
.service__sec01 .wp-block-column p{ margin: 0 auto;}
h2.service-initiative__title{margin-top: 0; border-left: none; font-size: 24px; font-weight: 500;}
.service-initiative__flex .wp-block-column{background-color: #F5F5F5; border-top: 4px solid #376BBA; border-radius: 5px; padding: 2%;}
.service-initiative__flex h3{border-left: none; padding: 0; margin: 0 0 1em;}
.service-initiative__flex p{width: 90%; display: block; margin: 0 auto; font-size: 15px;}

.headline-main{position: relative; font-size: 32px;}
.headline-main h2{border-left: none; text-align: center; font-size: 1em;}
.headline-main .en{font-size: 3em; color: var(--main-color); line-height: 1; opacity: 0.1; position: absolute; bottom: 14px; left: 50%; transform: translate(-50%,0);}

.sec02__flex h3{border-left: none; font-size: 24px; position: relative;}
.sec02__flex h3 img{position: absolute; top: -30px; left: -30px; z-index: -1;}

ul.service__sec02-list{display: block; width: 60%; margin: 0 auto; padding: 2% 5%;}

/*******************************
レスポンシブ
********************************/
@media screen and (max-width: 1140px) {
	.header__inner,
    .hero__inner,
    .sec02__inner,
    .company__inner{padding-right: 3%; padding-left: 3%;}
}
@media screen and (max-width: 1024px) {
	.hero__main-text{margin-bottom: 1em; font-size: 27px !important;}
    .hero__sub-text{font-size: 15px !important;}
    .sec02__title h2{font-size: 27px;}
    .sec02__title .sub-title{font-size: 1.2em;}
    .sec02__box{padding: 5% 3%;}
    .sec02__box-title{font-size: 21px;}
	.sec06__text{font-size: 18px;}
}
@media screen and (max-width: 896px) {
	.br-pc{display: none;}
    .header__inner{justify-content: space-between;}
    .header__logo{position: relative; top: auto;}
    .header__inner > .header__cv{display: none;}
    .header__menu-list > li{width: 100%; line-height: 1.7;}
    .header__menu-list > li:not(last-child){border-right: none;}
    .header__cv{padding-right: 5%; padding-left: 5%;}
	.page__content{display: flex; flex-direction: column;}
	.page__content #breadcrumbs{order: 3;}
	.page__content .page__hero{order: 1;}
	.page__content .page__inner{order: 2;}
    .hero__inner{flex-direction: column; margin-top: 80px;}
    .hero__img{width: 80%; max-width: 500px; margin-bottom: 40px;}
    .hero__content{width: 80%;}
    .hero__main-text{line-height: 1.5;}
	.sec02__leadtext{font-size: 18px;}
    .sec02__flex{flex-direction: column; gap: 40px;}
    .sec02__box{width: 100%; margin: 0;}
    .sec02__box-icon{left: 0;}
    .sec06__img img{height: 500px;}
    .sec06__inner{width: 94%; max-width: 596px;}
	
	.service-initiative__flex .wp-block-column{padding: 5%;}
	.service-initiative__flex p{width: 100%;}
	.has-medium-font-size{font-size: 18px !important;}
	
	.cate,
	.my-single{display: flex; flex-direction: column; padding-bottom: 0;}
	.cate #breadcrumbs,
	.my-single #breadcrumbs{order: 3;}
	.cate__content,
	.single__content{padding-bottom: 40px;}
}
@media screen and (max-width: 480px) {
	html{scroll-padding-top: 50px;}
    .hero__inner{margin-top: 40px;}
    .hero__img{width: 100%; margin-bottom: 20px;}
    .hero__content{width: 100%;}
    .sec02__leadtext{font-size: 16px;}
    .sec02__box-icon{top: -30px;}
    .sec02__box-icon img{width: 60%;}
    .sec02__box{padding: 10%;}
    .sec02__box-text{width: 100%;}
	.company__inner th{display: block; width: 100%; padding-bottom: 0; font-weight: bold;}
    .company__inner td{display: block; width: 100%;}
	.sec06__text{font-size: 15px;}
    .sec06__btn{font-size: 15px;}
	
	.my-page{padding-top: 0;}
	.page__hero h1,
	.headline-main h2{font-size: 27px;}
	.headline-main .en{font-size: 2.2em;}
	.has-medium-font-size{font-size: 16px !important;}
	.page__content #breadcrumbs,
	.cate #breadcrumbs{order: 1;}
	.page__content .page__hero,
	.cate__content{order: 2;}
	.page__content .page__inner{order: 3;}
	.page__inner .service__sec01 h2{font-size: 22px;}
	.sec02__flex h3{padding-left: 3.5em; font-size: 21px;}
	.sec02__flex h3 img{left: 0;}
	ul.service__sec02-list{width: 100%;padding: 10% 5% 10% 10%;}
	ul.service__sec02-list li:last-child{margin-bottom: 0;}
	
	.footer__cp{font-size: 12px;}
	
	.cate{padding-top: 0; display: flex; flex-direction: column;}
	.my-single{padding: 0 0 50px;}
}