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

/* 子テーマ用のスタイルを書く */
a, nav li{transition: background-color 0.3s ease, color 0.3s ease;}
a:not(.site-name):hover, nav li:hover{background:var(--colorMain) !important;color:var(--colorBg) !important;}
a:active, nav li:active{background:var(--colorMain) !important;color:var(--colorBg) !important;}
nav li:hover > a {color: var(--colorBg) !important;}
.editor-styles-wrapper{background: transparent;}
.header-container{box-shadow: none;}
.header-container .navi{background:var(--colorBlack);}
main#main{padding-top: 0;}
#footer,.footer-bottom{margin-top: 0;padding-top: 0;}
.navi-footer-in > .menu-footer li,.navi-footer-in > .menu-footer li:last-child{border: 0;}
.header-container, .main, .sidebar, .footer{background-color: transparent;background-image:none;}
.no-scrollable-main .main{color:var(--colorTxt);}
.archive .a-wrap, .under-entry-content .a-wrap{background-color:transparent;border:none !important;}
.entry-card-wrap.a-wrap:before{background-image:none !important;border:none !important;}
.entry-card-wrap.a-wrap:after{border:none !important;}
.wp-block-button__link{background-color:var(--colorMain);color:var(--colorBlack);font-weight:bold;}
.go-to-top-button{border: 2px outset var(--colorMain);}
#container .mobile-menu-buttons{background-color: unset;color: var(--colorMain);box-shadow:none;pointer-events: none;}
#container .mobile-menu-buttons .menu-button{align-items: flex-end;width: 60px;background-color: unset;pointer-events: all;}
.mobile-menu-buttons .menu-icon, .mobile-menu-buttons .menu-button > a{color: var(--colorMain);}
.comment-btn, .container input[type=submit]{width:100%;border: 2px solid var(--colorMain);}
.wpcf7 input.wpcf7-submit, .wpcf7 .wpcf7-previous{background-color: transparent !important;color: var(--colorMain) !important;}
.hidden{display:none;}
.tab-caption-box-content{color: var(--colorTxt);}
body .grecaptcha-badge{bottom: 0 !important;zoom: .8;opacity: .8;}


:root {
    --colorTxt:#fff;
    --colorGraytxt:#ccc;
    --colorMain:#f4a6b8;
    --colorpaleMain:#f8d2db;
    --colorMainTrs:rgba(244,166,184,0.1);
    --colorAccent:#f1449c;
    --colorPurple:#e097dd;
    --colorlavender:#cbc1fc;
    --colorBg:#321c22;
    --colorBgTrs:linear-gradient(300deg, var(--colorBlack) 0%, var(--colorBg) 100%);
    --colorBlack:#000;
    --colorBlackTrs:rgba(0,0,0,.5);
    --pcWidth:100%;
    --pcmaxWidth:1000px;
    --pcminWidth:600px;
    --spWidth:96%;
    --spHeaderHeight: 40px;
}
@media (max-width: 480px) {
    :root {--pcminWidth:unset;}
}

/* reset */
a,abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,
dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,
h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,input,kbd,textarea,
label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,
table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{box-sizing:border-box;margin:0;padding:0;word-wrap:break-word;overflow-wrap:break-word;}
table{border-collapse: collapse;}
a{text-decoration: none;}
ol,ul{list-style:none;}
img{display: block;max-width: 100%;height: auto;margin: auto;}
html,body{position: relative;width: 100%;}

/* font */
.zenantique{font-family: "Zen Antique", serif;font-weight: 400;font-style: normal;}

/* base */
html body{
    position: relative;color: var(--colorTxt);background: var(--colorBgTrs);min-width: 300px;
	font-size: 18px;line-height: 1.5;font-family: "Meiryo", "メイリオ", "Yu Gothic", "游ゴシック体", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;
}
#content #main h1,#content #main h2,#content #main h3,#content #main h4,#content #main h5,#content #main h6{
    font-family: "Zen Antique", serif;font-weight: 400;font-style: normal;
    color: var(--colorMain);line-height: 1.6;text-align: left;margin-bottom: .25em;padding: unset;border-radius: unset;border: unset;background-color: unset;background-image: unset;box-shadow: unset;text-shadow: unset;
}
#content #main h1{font-size: 2.2rem!important;}
#content #main h2{font-size: 1.6rem!important;}
#content #main h3{font-size: 1.4rem!important;}
#content #main h4,
#content #main h5,
#content #main h6{font-size: 1.2rem!important;}
#content #main h3 span{font-family: "Meiryo", "メイリオ", "Yu Gothic", "游ゴシック体", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;}
.header{background: var(--colorBlackTrs);}
.header .logo-image{padding: 0;}
.header .logo-image a,.header .logo-image a span{display: block;}
footer .sns-share{width: 60%;margin: auto;}

/* main column width */
body .wrap {width: 80%;max-width: var(--pcmaxWidth);min-width: var(--pcminWidth);}
@media (max-width: 480px) {body .wrap {width: auto;max-width: auto;min-width: auto;}}
body #navi-in{width: 90%;max-width: unset;}
body #navi-in a{font-size: .8em;}
body #navi-in ul.menu-top > li{width: calc(100% / 7);}
body #navi-in .has-icon{right: .5em;}
body .content{margin-top: 0;}


/* pc-sp switch */
body .display-pc{display: block;} body .display-sp{display: none;}
body .display-pc-in{display: inline-block;} body .display-sp-in{display: none;vertical-align: middle;}
@media (max-width: 480px) {body .display-pc{display: none;} body .display-sp{display: block;}body .display-pc-in{display: none;} body .display-sp-in{display: inline-block;vertical-align: middle;}}

/* menu グローバルメニュー サイドメニュー */
.navi-in > ul .sub-menu{background: var(--colorBlack);}
#navi-menu-content{color:var(--colorMain);background: var(--colorBlack);}
#navi-menu-content .menu-drawer a{color:var(--colorpaleMain);}

/* toc 目次 */
#toc{border: 0;}
#toc a{color: var(--colorTxt);}
#toc .toc-list {padding: 0 1em;}
#toc.toc-checkbox:checked~.toc-content{padding: .6em 0;}
.toc-title{background-image:none;}
.article .toc .toc-content{border:1px solid;}

/* Default Contact Button */
.contactLinkBtn{text-align: center;margin: 2rem auto;}
.contactLinkBtn a{display: inline-block;padding: .5em 1em;border: 2px solid var(--colorMain);}
.contactLinkBtn p{margin-bottom: .5em;}

/* top */
#content .a-wrap{color: var(--colorTxt);padding: .8em;background: var(--colorBlackTrs);}
#content .a-wrap:hover{color: var(--colorBlack)!important;background: var(--colorMain)!important;}
#content #main .a-wrap:hover h2{color: var(--colorBlack)!important;}
#content #main .wp-block-group{margin: 1rem auto 5rem!important;}
#content #main .defLink{position: relative;display: block;width: 18em;color: var(--colorMain);font-size: .9em;text-align: center;margin: 1rem auto;padding: .3em 0;border: 1px solid var(--colorMain);background: var(--colorMainTrs);}
#content #main .defLink::after{content: "\f105";font-family: "Font Awesome 5 Free";font-weight: 900;position: absolute;top: calc(50% - .8em);right: .1em;z-index: 3;}
.topMainVisual{display: block;margin-bottom: 1em;}
.topMainVisual img{width: 100%;height: auto;}

.topPlanList a{display: flex;flex-wrap: wrap;align-items: center;gap: .5em;border: 2px solid var(--colorMain);margin: 1em auto;padding: .8em;}
.topPlanList p{width: 8rem;color: var(--colorAccent);}
.topPlanList i{width: 2rem;font-size: 1.5rem;}
#content #main .topPlanList h3{width: calc(100% - 13rem);font-size: 1.2em;}
#content #main .topPlanList h3::after{display: none;}
#content #main .topPlanList p{width: 8rem;margin: 0;}
.topPlanList span{display: block;font-size: .7em;opacity: .8;}
.topPlanList a:hover{background: var(--colorMainTrs)!important;border: 2px solid var(--colorTxt);}
.topPlanList a:hover h3,
.topPlanList a:hover i{color: var(--colorTxt)!important;}
.topPlanList a:nth-of-type(2){filter: hue-rotate(340deg);}
.topPlanList a:nth-of-type(3){filter: hue-rotate(320deg);}
.topPlanList a:nth-of-type(4){filter: hue-rotate(300deg);}
.topPlanList a:nth-of-type(5){filter: hue-rotate(270deg);}
.topPlanList a:nth-of-type(6){filter: hue-rotate(240deg);}
.topPlanList a:nth-of-type(7){filter: hue-rotate(210deg);}

/* table */
#main table{table-layout: fixed;}
#main table th{background: #51333a;}
#main table tr:nth-of-type(2n),
#main table tr:nth-of-type(2n+1){background: #25181b;}
.scrollable-table.stfc-sticky table:not(.wp-calendar-table) tr > *:first-child{background: #38272b;}
#main table th,#main table td{line-height: 1.5;padding: .4em;}
.companyInfo th{width: 6em;}
.companyInfo small{display: block;}


/* 基本p */
.entry-content p{width: var(--spWidth);margin: auto auto 2em auto;}

/* webProductionPlan */
#webProductionPlan{display: flex;flex-wrap: wrap;justify-content: space-evenly;padding-left: unset;}
#webProductionPlan li{zoom: 1.1;position: relative;width: calc(96% / 3);min-width: 270px;text-align: center;margin: 0 0 1em 0;padding: 1em 1em 3em;border: 2px solid var(--colorMain);background: var(--colorMainTrs);}
#webProductionPlan li:nth-of-type(2){filter: hue-rotate(300deg);}
#webProductionPlan li:nth-of-type(3){filter: hue-rotate(250deg);}
#webProductionPlan li:nth-of-type(4){filter: hue-rotate(200deg);}
#webProductionPlan li:nth-of-type(5){filter: hue-rotate(150deg);}
#content #main #webProductionPlan li h3{font-size: 1.2em!important;text-align: center;margin-top: .5em;}
#webProductionPlan li a:not(.planNoneBtn){position: absolute;bottom: 1em;left: 10%;display: block;width: 80%;color: var(--colorBlack);font-size: .9em;margin: auto;padding: .5em;background: var(--colorMain);}
#webProductionPlan li b{font-size: 1.5em;}
#webProductionPlan li p{font-size: .8em;line-height: 1.5;text-align: left;}
#webProductionPlan li .webPdcCatch{font-size: .75em;opacity: .8;}
.process #webProductionPlan{filter: grayscale(.1) contrast(1.2) sepia(.1);}
.process #webProductionPlan li{zoom: 1;position: relative;width: calc(95% / 5);min-width: unset;margin-top: 1rem;padding: 1em .7em;}
.process #webProductionPlan li b{position: absolute;top: -1em;left: -.5em;display: inline-block;color: var(--colorBg);font-size: .9em;padding: .1em 1em;background: var(--colorMain);}
.process #webProductionPlan li p{margin-bottom: 0;}
.webProductionAfter{width: 80%;margin: 2rem auto;padding: 1em;zoom: .9;border: 1px solid var(--colorMain);background: var(--colorMainTrs);filter: grayscale(.8);}
.webProductionAfter ul{display: flex;flex-wrap: wrap;gap: 1em;}
.webProductionAfter li{position: relative;margin: 0 1em;}
.webProductionAfter li::before{content: "\f00c";font-family: "Font Awesome 5 Free";font-weight: 900;color: var(--colorAccent);padding-right: .5em;}

/* verify-age */
.verifyAgePlan #webProductionPlan li{zoom: 1.1;position: relative;width: calc(90% / 2);min-width: 310px;padding: 1em 1em 4.5em;}
.verifyAgePlan #webProductionPlan li p{margin-bottom: 0;}
.verifyAgePlan #webProductionPlan small{font-size: .8em;}
.verifyAgeCapInfo{width: 80%;margin: 2rem auto;padding: 1em;zoom: .9;border: 1px solid var(--colorMain);background: var(--colorMainTrs);filter: brightness(1.2) hue-rotate(55deg);}
.verifyAgeCapInfo p{margin: auto;}
.verifyAgeCapInfo span{color: var(--colorAccent);font-size: 1.5em;padding-left: .25em;}
.verifyAgeOption table{width: 80%;margin: .5rem auto;}
.verifyAgeOption th,.verifyAgeOption td{width: 26%;font-weight: normal;}
.verifyAgeOption td:nth-of-type(1){width: 22%;font-weight: normal;}
.verifyAgeOption td:nth-of-type(2){width: 22%;font-weight: normal;}
.verifyAgeOption td:nth-of-type(3){width: 30%;font-weight: normal;}
.verifyAgeOption th p,.verifyAgeOption td p{margin: 0;}
.verifyAgeOption td{text-align: right;}
.verifyAgeOption td small{font-size: .85em;color: var(--colorTxt);}
.verifyAgeSptColor{color: var(--colorPurple);}
.verifyAgeSptColorB{color: var(--colorlavender);position: relative;}
.verifyAgeSptColorB s{opacity: .8;}
.verifyAgeOption td.verifyAgeOptLeft{text-align: left;}
.verifyAgeOption td.verifyAgeOptCenter{text-align: center;}
#main .verifyAgeOption table .verifyAgeOptTtl{text-align: center;background: #381a21;}
#main .verifyAgeOption table th{font-size: .8em;}
.verifyAgeOption td .verifyAgeCampaign{font-size: .75em;color: var(--colorTxt);background: var(--colorAccent);padding: .25em .5em;}
.verifyAgeOption .verifyAgeNote,.verifyAgeFaq dl{width: 80%;margin: 1em auto auto;}
.verifyAgeOption .verifyAgeNote p{margin: 0;}
.verifyAgeOption .verifyAgeNote p b{color: var(--colorPurple);padding: .25em;}
.verifyAgeOption .verifyAgeNote .verifyAgeNote12 b,.verifyAgeOption .verifyAgeNote .verifyAgeNoteCmp b{color: #ceb8f7;padding: .25em;}
.verifyAgeOption .verifyAgeNote .verifyAgeNoteImg{margin-top: 1em;}
.verifyAgeOption .verifyAgeNote .verifyAgeNoteImg b{color: var(--colorlavender);}
.verifyAgeLead{width: 95.5%;font-size: .8em;line-height: 1.5;margin: 1.5rem auto;padding: .8em;}
/*.process.verifyAgeProcess #webProductionPlan li{zoom: 1;position: relative;width: calc(var(--spWidth) / 4);}*/
.verifyAgeForm{width: 80%;margin: 2rem auto;padding: 1em;background: var(--colorMainTrs);}
.verifyAgeTemplate{display: flex;flex-wrap: wrap;justify-content: space-between;text-align: center;}
.verifyAgeTemplate a{width: 48%;margin-bottom: 2em;}
.verifyAgeTemplate a:hover{background: none!important;filter: brightness(1.2);}
.verifyAgeTemplate a:hover img{filter: drop-shadow(0 0 6px var(--colorMain));}
.verifyAgeTemplate .verifyAgeTemplateInfo{width: 100%;font-size: .8em;color:var(--colorGraytxt);text-align: left;line-height: 1.4;}
#content #main .verifyAgeTemplate a h3{text-align: center;}
#content #main .article .verifyAgeFaq dl{font-size: .9em;}
#content #main .article .verifyAgeFaq dt{color: var(--colorpaleMain);font-size: 1.2em;}
#content #main .article .verifyAgeFaq dd{line-height: 1.5;margin-left: 0;margin-bottom: 2em;}
.verifyAgeForm textarea{padding: .8em;}
.verifyAgeSheetInfo{display: block;font-size: .8em;line-height: 1.3;opacity: .7;margin-bottom: .5em;}
.verifyAgeSheetInfo a{padding: 0 .3em;}
.verifyAgeForm input::placeholder,.verifyAgeForm textarea::placeholder{font-size: .8em;opacity: .7;}
.entry-content .verifyAgeFormHearing p{margin: auto auto 3em auto;}


/* dtp */
.processDtp #webProductionPlan li{zoom: 1;position: relative;width: calc(95% / 4);min-width: unset;margin-top: 1rem;padding: 1em;}
.dtpPlanImg{text-align: center;}
.dtpPlanImg img{max-height: 200px;width: auto;}
.dtpPlanImg .wp-element-caption{margin-top: .5em;}

/* movie */
#content #main .moviePlan h3{color: var(--colorpaleMain);;font-size: 1.1rem;margin-bottom: .5em;padding-bottom: .25em;border-bottom: 1px solid var(--colorMain);}
.mvAvailableList{display: flex;flex-wrap: wrap;gap: .5em;}
.mvAvailableList li{width: auto;}
.mvAvailableList li::before{content: "\f058";font-family: "Font Awesome 5 Free";font-weight: 900;color: var(--colorAccent);padding-right: .5em;}
.mvVertical{width: 70%;max-width: 400px;margin: 1em auto;}

@media (max-width: 480px) {
/* sp */
    /* base sp */
    #content #main h1{font-size: 1.7rem!important;}
    #content #main h2{font-size: 1.5rem!important;}
    #content #main h3{font-size: 1.3rem!important;}
    #content #main h4,
    #content #main h5,
    #content #main h6{font-size: 1.2rem!important;}
    #header{margin-bottom: 2rem;}
    #header .logo-header{padding-bottom: 0;}
    #header .logo-header img{width: 60vw;}
    #content #main .topPlanList a{gap: 0;}
    #content #main .topPlanList p{width: 100%;text-align: right;gap: 0;}
    #content #main .topPlanList i{width: 2rem;text-align: center;}
    #content #main .topPlanList h3{width: calc(100% - 2rem);font-size: 1.1em;padding-left: .5em;}
    .navi-footer-in > .menu-footer{display: block;}
    .navi-footer-in > .menu-footer li.menu-item{display: inline-block;width: auto;margin: .25em .5em;padding: .25em .5em;}
    footer .sns-share{width: 90%;}

    /* webProductionPlan sp */
    #webProductionPlan{display: flex;flex-wrap: wrap;flex-direction: column;}
    .process #webProductionPlan li{width: 100%;}
    .process.verifyAgeProcess #webProductionPlan li{zoom: 1;position: relative;width: 100%;min-width: unset;padding: 1em;}
    .process.verifyAgeProcess #webProductionPlan li a{position: relative;bottom: unset;left: unset;}

    footer .sns-share,.webProductionAfter,.verifyAgeCapInfo,.verifyAgeOption .verifyAgeNote,.verifyAgeFaq dl{width: 100%;margin: 2rem auto;}
    .verifyAgePlan #webProductionPlan li{width: 100%;min-width: unset;padding: 1em 1em 4.5em;}
    .verifyAgeOption table{width: 100%;zoom: .85;}
    .verifyAgeOption table span{display: block;padding-left: 0;}
    .verifyAgeForm,.verifyAgeFormHearing{width: 100%;}
    .verifyAgeTemplate{flex-wrap: nowrap;flex-direction: column;}
    .verifyAgeTemplate a{width: 100%;}
    #main .verifyAgeOption table td.verifyAgeSptColorBlarge{padding-top: 2em;}

    /* movie sp */
    .mvAvailableList{width: 100%;}
    .mvAvailableList li{width: 100%;}
    .mvVertical{width: 90%;}


}