@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@400&display=swap');
body {font-family: 'Zen Maru Gothic', sans-serif;}
html, body {overflow-x: hidden !important;max-width: 100% !important;}
body.menu-open {overflow-x: hidden !important;position: relative;}
.custom-overlay {display: none;position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;background-color: rgba(0, 0, 0, 0.5);z-index: 9998;opacity: 0;transition: opacity 0.5s ease;} 
.custom-overlay.open {display: block;opacity: 1; }
body {transition: margin-left 0.5s ease;margin-left: 0;}
.logo{z-index:2;position:absolute;top:3vw;left:3vw;}
body.menu-open {margin-left: -250px !important;}
.custom-menu-trigger {position: fixed !important;top: 20px !important;right: 20px !important;width: 36px;height: 28px;cursor: pointer;z-index: 10000 !important;background: none;border: none;padding: 0;display: block !important; }
.custom-menu-trigger span {display: block;position: absolute;left: 0;width: 100%;height: 4px;background-color: #1CA6D8;transition: all 0.5s ease;border-radius: 2px; }
.custom-menu-trigger.active span {background-color: #fff;}
.custom-menu-trigger span:nth-child(1) {top: 0;}
.custom-menu-trigger.active span:nth-child(1) {transform: translateY(12px) rotate(-45deg);}
.custom-menu-trigger span:nth-child(2) {top: 12px;} 
.custom-menu-trigger.active span:nth-child(2) {opacity: 0;}
.custom-menu-trigger span:nth-child(3) {bottom: 0;}
.custom-menu-trigger.active span:nth-child(3) {transform: translateY(-12px) rotate(45deg);}
.custom-nav {position: fixed !important;top: 0 !important;right: 0 !important;width: 250px;height: 100vh;background-color:#1CA6D8;z-index: 9999 !important;transform: translateX(250px);transition: transform 0.5s ease;padding-top: 100px;overflow-y: auto; }
.custom-nav.open {transform: translateX(0) !important; }
.custom-nav ul {list-style: none;margin: 0;padding: 0;}
.custom-nav li {color: #fff;text-align: center;padding: 15px 20px;border-bottom: 1px solid rgba(255, 255, 255, 0.1);transition: background-color 0.3s ease;}
.custom-nav li:hover {background-color: rgba(255, 255, 255, 0.1);}
.custom-nav a {color: #fff;text-decoration: none;display: block;font-size: 16px;}    

.sp-br{display:none;}
main#main.main{padding:0;border:none;}
div#content.content.cf{margin-top:0;}
.header-container{height:0;}
.hamburger{display:none;}
div#content-in.content-in.wrap{width:100%;}
.tagline{display:none;}
.content-in{justify-content:space-around;}

.fv{position:relative;}
.catch{background:rgb(28,166,216,0.4);position:absolute;top:15vw;left:3vw;padding:2vw;color:#fff;}
.catch1{font-size:3.5vw;font-weight:bold;}
.tax{font-size:2vw;}
.catch2{font-size:5.6vw;font-weight:bold;}
.catch3{font-size:2vw;text-align:right;font-weight:bold;}
.gyouretsu{padding:7vw 0 25vw;text-align:center;background:url(img/gyouretsu.webp);background-position:bottom;background-repeat:no-repeat;background-size:contain;}
h2{color:#1CA6D8;font-size:3vw;font-weight:bold;text-align:center;margin-bottom:5vw;}
.nayami{padding:7vw 0;background:#FFF7F9;}
.nayami h2{color:#EC789D;font-size:3vw;font-weight:bold;}
.nayami-img img{width:100%;}
.nayami-img {width:60%;margin:auto;margin-bottom:5vw;;}
.nayami-bx{display:flex;flex-direction:row;justify-content:space-between;flex-wrap:wrap;width:60%;margin:auto;}
.nayami-ctt{width:48%;margin-bottom:30px;padding:20px 30px;border-radius:20px;background:#fff;box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.4);}
.nayami h3{margin-bottom:10px;text-align:center;color:#EC789D;}
.no1{padding:7vw 0;}
.no1-bx{display:flex;flex-direction:row;justify-content:space-between;flex-wrap:wrap;width:60%;margin:auto;}
.no1-ctt{width:48%;margin-bottom:30px;padding:20px 30px;background:#ECFCFF;box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.4);}
.no1 h3{margin-bottom:10px;}
.h3-bx{display:flex;justify-content:center;align-items:center;gap:20px;}
.h3-bx svg{color:#1CA6D8;}
.feature{padding:7vw 0;background:#FFF7F9;}
.feature h2{color:#EC789D;font-size:3vw;font-weight:bold;}
.feature-bx{background:#fff;display:flex;flex-direction:row;justify-content:space-between;align-items:center;flex-wrap:wrap;width:60%;margin:auto;margin-bottom:3vw;}
.feature-bx2{background:#fff;display:flex;flex-direction:row;justify-content:space-between;align-items:center;flex-wrap:wrap;width:60%;margin:auto;margin-bottom:3vw;}
.feature-img img{width:100%;}
.feature-img{width:50%;}
.feature-ctt{width:50%;padding:30px;}
.feature-ctt{width:50%;padding:30px;}
.feature-bx h3{text-align:center;margin-bottom:10px;}
.feature-bx2 h3{text-align:center;margin-bottom:10px;}
.num{color:#fff;background:#EC789D;border-radius:50%;width: 2.5vw;height: 2.5vw;display: inline-block;margin-right: 1vw;}
.introduce{padding:7vw 0;}
.flow{padding:7vw 0;background:#FFF7F9;}
.flow h2{color:#EC789D;font-size:3vw;font-weight:bold;}
.flow_design05 {display: flex;align-items: center;width:60%;margin:auto;}
.flow05 {padding-left: 0;}
.flow05 > li {list-style-type: none;position: relative;padding-left: 50px;}
.flow05 > li:not(:last-child) {padding-bottom:3vw;}
.flow05 > li .icon05 {width: 3vw;height: 3vw;font-size: 1.5vw;line-height:2.8vw;text-align: center;border-radius:50%;display: inline-block;background: #EC789D; color: #fff;position: absolute;left: 0;}
.flow05 > li:not(:last-child)::before {content: '';background: #c3c3c3;width: 4px;height: 100%; position: absolute;top: calc(50% - -30px);left:1.4vw;transform: translateY(-50%);-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);}
.flow05 > li dl dt { font-size: 1.3em;font-weight: 600;color: #EC789D;}
.flow05 > li dl dd {margin-left: 0;}
.flow05 > li dl{margin-left:1vw;}

.faq{padding:7vw 0 10vw 0;}
.accordion {width:60%;margin:auto;margin-top:20px;position:relative;}
.question-bx {display: flex; justify-content: space-between; align-items: center; padding: 20px; cursor: pointer;}
.q{height:30px;width:30px;color:#fff;background:#000;border-radius: 50%;display: inline-block;padding: 5px;line-height: 20px;text-align: center;margin-right: 10px;}
.cbx{width:10%;}
.qbx{width:80%;font-size:1.2vw;}
.abx{width:90%;margin-bottom:20px;font-size:1.2vw;}
.accordion .toggle-icon {width:10%;padding-left:4vw;}
.accordion .toggle-icon::before, .accordion .toggle-icon::after {  content: ''; position: absolute; width:20px; height: 2px; background: #543C32;transform: translate(-50%, -50%); transition: transform 0.2s ease;}
.accordion .toggle-icon::before { transform: rotate(90deg); }
.accordion .toggle-icon::after { transform: rotate(0deg); }
.accordion input[type="checkbox"] { display: none; }
.accordion input[type="checkbox"]:checked + .question-bx .toggle-icon::before { transform: rotate(0deg); }
.accordion input[type="checkbox"]:checked + .question-bx .toggle-icon::after { transform: rotate(90deg) scale(0); }
.accordion .answer {max-height: 0; overflow: hidden;transition: max-height 0.4s ease, padding 0.4s; position: relative; display: flex; flex-direction: row; padding:0 20px;}
.accordion input[type="checkbox"]:checked ~ .answer { max-height: 200px; padding:20px; }
.item{width:100%;position:relative;background:#ECFCFF;}

.cta{position:relative;}
.cta-bg{background:rgb(245,245,245,0.8);height:100%;width:100%;position: absolute;top: 0;}
.cta .cta-ctt{top: 50%;left: 50%;transform: translateY(-50%) translateX(-50%); -webkit- transform: translateY(-50%) translateX(-50%);position:absolute;}
.more-btn {display: block;text-align: center;vertical-align: middle;text-decoration: none;width:300px;margin: auto;padding: 1rem 4rem;border-radius: 100vw;color: #fff;background: #1CA6D8;}
.more-btn:hover {background-position: right center;background-size: 200% auto;-webkit-animation: pulse 2s infinite;animation: shad26 1.5s infinite;color: #fff;}
@keyframes shad26 {0% {box-shadow: 0 0 0 0 #1CA6D8;}70% {box-shadow: 0 0 0 10px rgb(39 172 217 / 0%);}100% {box-shadow: 0 0 0 0 rgb(39 172 217 / 0%);}}

.footer {margin-top:0;}
.fmenu{margin:50px 0 100px 0;}
.fmenu ul{display:flex;flex-direction:row;justify-content:space-around;width:60%;margin:auto;padding-left: 0;}
.fmenu ul li{list-style:none;}
.fmenu ul li a{text-decoration:none;font-size:1.5vw;}


.under-fv{position:relative;height:100vh;}
.under-fv img{height:100%;width:100%;object-fit:cover;object-position:center;}	
.under-fv-bg{background:rgb(245,245,245,0.8);height:100%;width:100%;position: absolute;top: 0;}
.h1-company{color:#1CA6D8;top: 50%;left: 50%;transform: translateY(-50%) translateX(-50%); -webkit- transform: translateY(-50%) translateX(-50%);position:absolute;font-size:4vw;text-align:center;}
.h1-company::before{content:"company";display:block;color:#1CA6D8;font-size:60%;}
table tr:nth-of-type(2n+1) {background-color:transparent;}
.contact-table th{background:#fff;border-left:none;border-right:none;border-top:none;border-bottom:solid 1px #1ca6d8;}
.contact-table td{background:#fff;border-left:none;border-right:none;border-top:none;border-bottom:solid 1px #1ca6d8;color:#1ca6d8;font-weight:bold;}
.acceptance{text-align:center;margin-top:5vw;font-size:1.2vw;}
.must{background: #1ca6d8;color:#fff;font-size:80%;border-radius:10px;margin-left:10px;padding:5px 10px;}
.under-inner{width:60%;margin:auto;padding:100px 0;}
.h1-news{color:#1CA6D8;top: 50%;left: 50%;transform: translateY(-50%) translateX(-50%); -webkit- transform: translateY(-50%) translateX(-50%);position:absolute;font-size:4vw;text-align:center;}
.h1-news::before{content:"news";display:block;color:#1CA6D8;font-size:60%;}
.new-list{display:flex;flex-direction:row;justify-content:space-between;flex-wrap: wrap;width:100%;margin:auto;margin-bottom:50px;}
.new-list-box{width:30%;margin:20px 0;}
.new-list:after {content: "";display: block;width: 30%;height: 0;}
.new-list-box a{text-decoration:none;display:inline-block;color:#666;}
.new-list-box a :hover{opacity:0.7;}
.pagination{display:block!important;}
.pagination-next {display:none;}
.pnavi{display:flex;flex-direction:row;justify-content:center;margin-bottom:80px;}
.nav-links{display:flex;}
.pagination .page-numbers{display:inline-block;color:#1CA6D8;border:solid 1px #27acd9;background:#fff;margin:0;}
.pagination .current{color:#fff!important;background:#1CA6D8!important;border:solid 1px #1CA6D8;}
.pagination .next.page-numbers{width:40px;height:40px;}
.pagination .prev.page-numbers{width:40px;height:40px;}
.pagination a:hover{background:transparent;color:#1CA6D8;}

.h1-works{color:#1CA6D8;top: 50%;left: 50%;transform: translateY(-50%) translateX(-50%); -webkit- transform: translateY(-50%) translateX(-50%);position:absolute;font-size:4vw;text-align:center;}
.h1-works::before{content:"works";display:block;color:#1CA6D8;font-size:60%;}

.h1-faq{color:#1CA6D8;top: 50%;left: 50%;transform: translateY(-50%) translateX(-50%); -webkit- transform: translateY(-50%) translateX(-50%);position:absolute;font-size:4vw;text-align:center;}
.h1-faq::before{content:"faq";display:block;color:#1CA6D8;font-size:60%;}
.under-inner .accordion{width:100%;}

.h1-contact{color:#1CA6D8;top: 50%;left: 50%;transform: translateY(-50%) translateX(-50%); -webkit- transform: translateY(-50%) translateX(-50%);position:absolute;font-size:4vw;text-align:center;}
.h1-contact::before{content:"contact";display:block;color:#1CA6D8;font-size:60%;}
.must{background: #1CA6D8;color:#fff;font-size:80%;border-radius:10px;margin-left:10px;padding:5px 10px;}
.cbtn{text-align:center;margin-top:3vw;}
.cbtn p a{text-decoration:none;}
input[type='submit'] {display: block;text-align: center;vertical-align: middle;text-decoration: none;width:300px;margin: auto;padding: 1rem 4rem;border-radius: 100vw;color: #fff;background: #1CA6D8;}
input[type='submit']:hover {background-position: right center;background-size: 200% auto;-webkit-animation: pulse 2s infinite;animation: shad26 1.5s infinite;color: #fff;}
@keyframes shad26 {0% {box-shadow: 0 0 0 0 #1CA6D8;}70% {box-shadow: 0 0 0 10px rgb(39 172 217 / 0%);}100% {box-shadow: 0 0 0 0 rgb(39 172 217 / 0%);}}
.h1-thanks{color:#1CA6D8;top: 50%;left: 50%;transform: translateY(-50%) translateX(-50%); -webkit- transform: translateY(-50%) translateX(-50%);position:absolute;font-size:4vw;text-align:center;}
.h1-thanks::before{content:"thanks";display:block;color:#1CA6D8;font-size:60%;}
.thanksp{text-align:center;margin-bottom:50px;}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*960px以下*/
@media screen and (max-width: 960px){
  /*必要ならばここにコードを書く*/
.sp-br{display:block;}
h2 {font-size: 6vw;}
.nayami h2 {font-size: 6vw;}
.gyouretsu {padding: 10vw 0 30vw;}
h3 {font-size: 4vw;}
.nayami-bx { width: 90%;}
.nayami-ctt {width: 100%;margin-bottom: 20px;}
.nayami-ctt p{font-size:3vw;}
.nayami {padding: 10vw 0;}
.no1-bx {width: 90%;}
.no1-ctt {width: 100%;margin-bottom: 20px;}	
.no1-ctt p{font-size:3vw;}
.no1 {padding: 10vw 0;}	
.feature h2 { font-size: 6vw;}
.feature-bx {width: 90%;flex-direction:column-reverse;}
.feature-bx2 {width: 90%;flex-direction:column;}	
.feature {padding:10vw 0;}
.feature-ctt { width: 100%;}
.feature-ctt p{font-size:3vw;}
.feature-img { width: 100%;}
.num {width: 8vw;height: 8vw;margin-right: 2vw;font-size: 4vw;}
.introduce {padding: 10vw 0;}
.flow { padding: 10vw 0;}
.flow h2 {font-size: 6vw;}
.flow05 > li .icon05 {width: 8vw;height: 8vw;font-size: 4vw;line-height: 8vw;left: 8px;}
.flow05 > li dl {margin-left: 6vw;}
.flow05 > li dl dt { font-size: 4vw;}	
.flow05 > li dl dd {font-size: 3vw;}
.flow_design05 {width: 90%;}
.flow05 > li:not(:last-child)::before { left: 4.8vw;}
.faq {padding: 10vw 0 10vw 0;}
.accordion {width: 90%;}
.qbx {font-size: 3vw;width: 74%;}
.question-bx {padding: 15px;}
.accordion input[type="checkbox"]:checked ~ .answer {padding: 15px;}
.accordion .answer {padding: 0 15px;}
.abx {margin-left: 5%;font-size:3vw;}
.q {height: 8vw; width: 8vw;line-height: 6vw;font-size: 4vw;}
.fmenu {display: none;}
.more-btn {width: 60vw; font-size: 4vw;padding: 1rem 3rem;}
.copyright {font-size: 3vw;}
.go-to-top {display:none;}
.catch {top: auto;left:3%;padding: 2vw;bottom: 5%;}
.catch1 {font-size: 7vw;}
.tax { font-size: 3vw;}
.catch2 {font-size: 10.8vw;}
.catch3 {font-size: 5vw;}
.cta {height: 60vh;}
.cta img{height:100%;width:100%;object-fit:cover;object-position: 60% 70%;}	
.fv{position:relative;height:60vh;overflow:hidden;}
.fv img{height:100%;width:100%;object-fit:cover;object-position:70% 70%;}	
.under-inner { width: 90%;}
.contact-table th{background:#1ca6d8;border:none;display:block;}
.contact-table th {color:#fff;}
.must{background:#fff;color:#1ca6d8;}
.contact-table td{border:none;display:block;}
.under-fv {height: 60vh;}
.h1-contact {font-size: 8vw;}
.h1-company {font-size: 8vw;}	
.h1-news {font-size: 8vw;}
.h1-faq {font-size: 8vw;}	
.h1-works {font-size: 8vw;}
.h1-thanks {font-size: 8vw;}
.new-list-box {width:100%;}
.single div#content.content.cf {width:90%;}
.logo {left: 0vw;width: 50%;}
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
h2 {font-size: 7vw; line-height: 1.5;}
.nayami h2 { font-size: 7vw; }
h3 { font-size: 5vw;line-height: 1.5;}
.nayami-ctt p { font-size: 4vw;}
.no1-ctt p {font-size: 4vw; }
.nayami-ctt {padding: 20px;}
.no1-ctt {padding: 20px;}
.feature-ctt {padding: 20px;}
.feature-bx h3 {display: flex;align-items: center;justify-content: center;}
.num {width: 10vw;height: 10vw;margin-right: 3vw;font-size: 6vw;}
.feature-ctt p {font-size: 4vw; }
.flow05 > li .icon05 {width: 10vw;height: 10vw; font-size: 6vw;line-height: 10vw; left: 1px;}
.flow05 > li dl { margin-left: 0vw;}
.flow05 > li dl dt {font-size: 5vw;}
.flow05 > li dl dd {font-size: 4vw; }
.qbx {font-size: 4vw;width: 70%;margin-bottom:0;}
.abx {font-size: 4vw; }
	

}