@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
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
body{background:#fff;}
.table-scroll-hint {display:none;}
.custom-nav{display:none;}
.custom-overlay{display:none;}
.custom-menu-trigger{display:none;}
.float-bx{display:none;}
.sp-br{display:none;}
.drawer{display:none;}
.ham-bx{display:none;}
div#header-in.header-in.wrap.cf {width:100%;}
main#main.main{padding:0;border:0;margin:0;}
.header-in{width:100%;position: fixed;top: 0;z-index: 100;background:transparent;transition:0.7s;}
.header-in.scrolled {background: rgba(255, 255, 255, 0.8);backdrop-filter: blur(10px);}
.header-ctt{width:100%;height:80px;position:relative;margin:auto;display: flex;justify-content: space-between;align-items: center;}
.header-nav{display:flex;align-items: center;gap:40px;}
.header-nav li {list-style:none;}
.header-nav li a{text-decoration:none;transition:0.7s;font-size:1.05rem;color:#fff;}
.header-nav li a:hover{opacity:0.7;}
.header-in.scrolled .header-nav li a{color:#7d7d7d;}
.wrap{width:100%;}
.header-bx{display:flex;justify-content: flex-end;gap:100px;}
.header-contact{background:#27acd9;height:80px;padding:0 30px;color:#fff!important;display: flex;justify-content: center;align-items: center;text-decoration:none;transition:0.7s;border:solid 1px #27acd9;}
.header-contact:hover{background:transparent;color:#27acd9!important;}
.ham-bx{display:none;}
.content{margin-top:0;}
.content-in{width:100%;}
.catch{position: absolute;top: 60%;left: 50%;transform: translateY(-50%) translateX(-50%);-webkit- transform: translateY(-50%) translateX(-50%);max-width:1000px;width:90%;}
.catch1{font-size:3.5rem;font-weight:600;margin-bottom:10px;color:#7d7d7d;}
.catch2{font-size:1.5rem;font-weight:600;}
.logo-area {padding-left:20px;}
.tagline{padding:0;margin:0;}
#header-logo-svg {color: #fff;transition: color 0.4s ease;}
.header-in.scrolled #header-logo-svg {color: #27acd9;}

p{color:#7d7d7d;font-size: 1rem;}
a{color:#7d7d7d;font-size: 1rem;text-decoration:none;}
a:hover{color:#7d7d7d;}
h2{color:#7d7d7d;font-size:1.7rem;margin-bottom:30px;}
.inner{max-width:1000px;width:90%;margin:auto;}
ul li {color:#7d7d7d;font-size: 1rem;text-decoration:none;}
h3{color:#7d7d7d;font-size: 1.2rem;}
.fv{width:100%;margin:auto;height:800px;position:relative;}
.fv img{width:100%;height:800px;object-fit:cover;object-position:top;}
.content{margin-top:0;}
.content-in{width:100%;}
.catch{position: absolute;top: 50%;left:50%;transform: translateY(-50%) translateX(-50%);-webkit- transform: translateY(-50%) translateX(-50%);width:90%;max-width:1440px;}

.more{transition:0.7s;display:block;width:250px;margin:70px auto 0;background:#27acd9;color:#fff;text-decoration:none;display:flex;justify-content:center;align-items:center;padding:15px 0;}
.more:hover{opacity:0.8;color:#fff;}

.problem{padding:100px 0;}
.problem-bx{display:flex;gap:20px;}
.problem-ctt{border:solid 1px #7d7d7d;padding:25px;}
.problem-ctt .num{font-family: 'Inter', sans-serif;font-weight:300;font-size:2rem;}
.problem-ctt h3{margin-bottom:10px;}
.problem h2{text-align:center;}
.problem h2:before{content:"Problem";font-family: 'Inter', sans-serif;font-size:1rem;color:#27acd9;display:block;}

.reason{padding:100px 0;background:#f8f8f8;}
.reason h2{text-align:center;}
.reason h2:before{content:"Reason";font-family: 'Inter', sans-serif;font-size:1rem;color:#27acd9;display:block;}
.reason-bx{display:flex;gap:20px;margin-top:30px;}
.reason-ctt{background:#7d7d7d;padding:25px;flex:1;}
.reason-ctt p{color:#fff;}
.reason-ctt h3{margin-bottom:10px;color:#fff;}

.cost{padding:100px 0;}
.cost h2{text-align:center;}
.cost h2:before{content:"Cost";font-family: 'Inter', sans-serif;font-size:1rem;color:#27acd9;display:block;}
.cost-bx{display:flex;gap:100px;width:100%;margin:50px auto 50px;padding: 50px 150px;background:#fafafa;}
.cost1{font-family: 'Inter', sans-serif;font-size: 4.5rem;font-weight: 600;color:#27acd9;}
.cost-left p{text-align:left;}
.cost-right ul li{list-style:none;}
.cost-right ul li:before{content: '✓';padding-right:5px;font-weight: 700;color:#27acd9;}

table tr:nth-of-type(2n+1) {background-color:transparent;}
.cost-table td{text-align:center;color:#7d7d7d;}
.cost-table th{background:#f8f8f8;color:#7d7d7d;font-weight:400;}
.cost-td{color:#27acd9!important;font-weight:600;}
.cost p{text-align:center;}


.flow{padding:100px 0;background:#f8f8f8;}
.flow-line {position: absolute;top: 25px;left: 0;width: 0;background: #27acd9;height: 1px;width:100%;}
.flow h2{text-align:center;}
.flow h2:before{content:"Flow";color:#27acd9;font-size:1rem;display:block;}
.flow-bx{display:flex;gap:40px;width:100%;margin:50px auto 0;position:relative;}
.flow p{text-align:center;}
.flow-ctt p{text-align:left;}
.flow-ctt {width:25%;}
.flow-num{font-family: 'Inter', sans-serif;font-size: 1.2rem;color: #fff;background: #27acd9;border-radius: 50%;width: 50px;height: 50px;display: flex;justify-content: center;align-items: center;margin:0 auto 30px;position:relative;}
.flow-ctt h3{text-align:center;}

.faq{padding:100px 0;}
.faq h2{text-align:center;}
.faq h2:before{content:"Faq";font-size:1rem;display:block;font-family:'Inter', sans-serif;color:#27acd9;}
.faq .inner{margin-top:50px;}
.accordion-ctt {margin-bottom:50px;}
.accordion{border-bottom:solid 1px #27acd9;}
.ques {display: flex; justify-content: space-between; align-items: center; padding:20px 0; cursor: pointer;}
.q{font-family:'Inter', sans-serif;height:50px;width:50px;background:#27acd9;color:#fff;border-radius: 50%;display:inline-flex;justify-content:center;align-items:center;padding: 5px;text-align: center;margin-right:10px;margin-bottom:5px;font-weight:bold;}
.accordion .toggle-icon {  position: relative; display: inline-block; padding: 20px; line-height:1.5; text-align: center; }
.accordion .toggle-icon::before, .accordion .toggle-icon::after {  content: ''; position: absolute; width: 20px; height: 3px; background: #27acd9; top: 50%; left: 31%; 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 + .ques .toggle-icon::before { transform: rotate(0deg); }
.accordion input[type="checkbox"]:checked + .ques .toggle-icon::after { transform: rotate(90deg) scale(0); }
.accordion .answer {  max-height: 0; overflow: hidden; padding: 0; transition: max-height 0.4s ease, padding 0.4s; position: relative;}
.accordion input[type="checkbox"]:checked ~ .answer { max-height: 300px; padding: 15px 0; }
.a{font-family:'Inter', sans-serif;height:50px;width:50px;background:#27acd9;color:#fff;border-radius: 50%;;display:inline-flex;justify-content:center;align-items:center;padding: 5px;text-align: center;margin-right:10px;margin-bottom:5px;font-weight:bold;}


.footer {margin-top:0;padding:0;}
#footer-in {width:100%;}
.fcontact{position:relative;width:100%;display:block;margin:auto;height:400px;padding:50px 0;background:url(img/footer-bg.webp);background-size:cover;background-repeat:no-repeat;background-position:center;z-index:1;}
.fcontact::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;background:rgb(0,0,0,0.3);}
.footerp{color:#fff;}
.finner{width:100%;position:absolute;top: 50%;left: 50%;transform: translateY(-50%) translateX(-50%); -webkit- transform: translateY(-50%) translateX(-50%);padding:0 50px;box-sizing:border-box;}
.trialp1{font-size:3rem;color:#fff;text-align:center;font-weight:700;}
.trialp2{color:#fff;text-align:center;}
.fmenu{display:flex;gap:20px;margin: 50px 0;justify-content: center;}

.bread{max-width:1000px;width:100%;margin:auto;}
.breadcrumb {margin: 1em 0;font-size: 1rem;color:#7d7d7d;}
.breadcrumb a{color:#7d7d7d;}
.page-fv{background:url(img/page-fv.webp);background-position:bottom;background-size:cover;height:400px;position:relative;}
.page-fv:before{content:"";background:rgb(0,0,0,0.2);height:400px;width:100%;top:0;left:0;position:absolute;}
.page-ttl{font-size:2.5rem;position:absolute;top:50%;left:0;transform:translateY(-50%);font-weight:bold;color:#fff;}
.h1-page{font-size:1rem;font-weight:normal;position:absolute;bottom:10px;left:0;color:#fff;}
.page-fv .inner{position:relative;height:400px;}
.under-inner{width:90%;max-width:1000px;margin:auto;padding:50px 0 100px 0;}

.error404 .content-in{margin-top:150px;}
.not-found{width:40%;}
.error404 .post{text-align:center;}
.error404 .header-nav li a{color:#7d7d7d;}
.error404  #header-logo-svg {color: #27acd9;}
.contact-bx p{text-align:center;}
.single-post .header-nav li a{color:#7d7d7d;}
.single-post #header-logo-svg {color: #27acd9;}


.list-inner{text-align:left;}
.pdate{color:#27acd9;font-weight:bold;}
.new-list{display:grid;grid-template-columns: repeat(3, 1fr);gap:20px;}
.new-list-box{margin:20px 0;display:block;}
.new-list:after {content: "";display: block;width: 30%;height: 0;}
.new-list-box{text-decoration:none;display:inline-block;transition:0.7s;}
.new-list-box:hover{opacity:0.7;}
.post-meta{display:flex;gap:20px;align-items:center;margin:10px 0;}
.pcate {background:#27acd9;padding:0 15px;color: #fff;font-size:0.9rem;}
.new-list-img {width:100%;height:240px;}
.new-list-img img{height:240px;object-fit:cover;}

.pagination {display: block;}
.pagination-next {display:none;}
.pnavi{display:flex;flex-direction:row;justify-content:center;gap:5px;}
.pnavi a{transition:0.7s;}
.nav-links{display:flex;}
.pnavi .page-numbers{display:inline-block;color:#27acd9;border:solid 1px #27acd9;border-radius:0;background:#fff;margin:0;}
.pnavi .current{color:#fff;background:#27acd9;border:solid 1px #27acd9;}
.pnavi .next.page-numbers{width:46px;}
.pnavi .prev.page-numbers{width:46px;}
.pnavi a:hover{background:#27acd9;color:#fff;}
.entry-title{padding:0  0 0.6em 0;color:#27acd9;}
.single-post .content-in{justify-content:space-around;max-width:1000px;width:100%;margin-top:120px;}
.single-post .content-in h2{font-size:24px;color:#fff;padding:15px;margin:50px 0 20px 0;background:#27acd9;}
.single-post .content-in h3{border-bottom:solid 2px#27acd9;border-left:none;border-top:none;border-right:none;padding:5px 10px;font-size:20px;}
.single-post .content-in h4{padding:10px;font-size:18px;background:#7d7d7d;color:#fff;border:none;}
#sidebar h3 {border-bottom: none;background:#27acd9;color: #fff;}

.must{background: #D93A49;color: #fff;font-size:0.9rem;padding: 2px 10px;margin-left:10px;}
.wpcf7-spinner{display:none;}
.acceptance {margin-top:50px;}
.acceptance p{text-align:center;font-size:15px;display: flex;justify-content: center;}
.cbtn{text-align:center;margin-top:20px;position:relative;height:40px;}
.cbtn p a{text-decoration:none;}
input[type='submit']{transition:0.7s;display:block;width:250px;margin:70px auto 0;background:#27acd9;color:#fff;text-decoration:none;display:flex;justify-content:center;align-items:center;padding:15px 0;cursor:pointer;}
input[type='submit']:hover{opacity:0.8;color:#fff;}
.wpcf7-spinner{display:none;}
input[type='submit'] a{text-decoration:none;}
.wpcf7-list-item {margin: 0;}
.h2-company{margin:100px 0 50px 0;text-align:center;}
.company-table th{width:30%;background:transparent;border-left:none;border-top:none;border-right:none;border-bottom:solid 1px #7d7d7d;color:#7d7d7d;font-size:1rem;padding: 1em;}
.company-table td{width:70%;background:transparent;border-left:none;border-top:none;border-right:none;border-bottom:solid 1px #7d7d7d;color:#7d7d7d;font-size:1rem;padding: 1em 0;}
.company-table td p{text-align:left;}
table tr:nth-of-type(2n+1) {background:transparent;}
.company-table a{color:#7d7d7d;text-decoration:none;}
.wpcf7-list-item {display:block;}
.h2-pp{font-size:1.6rem;margin: 10px 0 20px 0;}
.h3-pp{margin:30px 0 10px 0;}

.guide-bx{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.guide-ctt{border:solid 1px #7d7d7d;padding:25px;}
.guide-ctt h3{margin-bottom:10px;}
.guide-sec{margin-bottom:100px;}
.h2-guide{margin:0 0 50px 0;text-align:center;}
.secp{margin-bottom:30px;}
.nbtm{margin-bottom:0;}

.under-inner .cost-bx{margin:0 auto 50px;}
.h2-cost{margin:100px 0 50px 0;text-align:center;}
.contactp{margin-bottom:30px;}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1024px以下*/
@media screen and (max-width: 1024px){
  /*必要ならばここにコードを書く*/
.sp-br{display:block;}
h2 {font-size: 1.5rem;}
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;}
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: 2px;background-color: #fff;transition: all 0.5s ease;}
.custom-menu-trigger.active span {background-color: #fff!important;z-index: 10000 !important;}
.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 {display:block;position: fixed !important;top: 0 !important;right: 0 !important;width: 250px;height: 100vh;background-color:#7d7d7d;z-index:9999!important;transform: translateX(250px);transition: transform 0.5s ease;padding-top: 70px;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: 10px 0;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;}   

.header-in.scrolled {background:transparent;backdrop-filter: none;}
.header-in.scrolled .custom-menu-trigger span {background-color: #27acd9;}
.header-bx {display: none;}
.catch1 { font-size: 2rem; color:#fff;text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);}
.catch2 {font-size: 1.2rem; color:#fff;text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);}
.problem-bx {flex-direction: column;}
.problem-ctt {padding: 20px;}
.problem-ctt div{display:flex;gap:10px;align-items:center;}
.problem-ctt h3 {margin-bottom:0;}
.reason-bx {flex-direction: column;}
.reason-ctt {padding: 20px;}
.cost-bx {gap: 40px;margin:0 auto 50px;padding: 20px;flex-direction: column;}
.cost1 {font-size: 3rem;}
.cost-left p{text-align:center;}
.flow-num { margin: 0 auto 15px;}
.flow-ctt p { text-align: center;}
.flow-ctt {width: 100%;}
.flow-bx {flex-direction: column;}
.flow-line {display: none;}
.trialp1 {font-size: 1.7rem;}	

.float-bx{display:flex;justify-content:space-between;position:fixed;bottom:0;width:100%;left:0;height:50px;z-index:10;}
.float-btn{bottom: initial;right: initial;width: 100%; height: auto;display:flex;justify-content:center;align-items:center;position: relative;background:#27acd9;text-align:center;text-decoration:none;}	
.t2{font-size:1rem;color:#fff;}
.go-to-top {display:none;}	
	
.single-works .custom-menu-trigger span{background-color:#27acd9!important;}
.single-post .custom-menu-trigger span{background-color:#27acd9!important;}
.error404 .custom-menu-trigger span{background-color:#27acd9!important;}
.thanks .custom-menu-trigger span{background-color:#27acd9!important;}	
.h2-pp{font-size:1.4rem;}
.page-ttl {font-size: 1.8rem;}

.company-table th{width:100%;display:block;border-bottom:none;text-align:left;padding:2em 0 0.5em 0;}
.company-table td{width:100%;display:block;background:transparent;padding:0 0 1em 0 ;}	
.company-table {width: 100%;}	
	
.new-list{grid-template-columns: repeat(1, 1fr);}
.new-list-img {width:100%;height:240px;}
.new-list-img img{width:100%;height:240px;object-fit:cover;}
.bread {width: 90%;}
.single-post .bread {width: 100%;}
.single-post h2{width: 100%;}
.single-post .content{width:90%;margin:auto;}	
main.main, div.sidebar {padding:0;margin: 12px 0;}	
.guide-bx {grid-template-columns: repeat(1, 1fr);}
.guide-ctt {padding:20px;}	
.fmenu{display:none;}	
.footer-bottom {margin-bottom: 70px;}
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}

@media (max-width: 767px) {
.table-scroll-wrapper {overflow-x: auto;-webkit-overflow-scrolling: touch;}
.table-scroll-wrapper table { width: auto !important; min-width: 600px;}
.table-scroll-hint {display:block;font-size: 12px;color: #888;text-align: center;margin-bottom: 4px;}
}
