@charset "UTF-8";


@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP&family=Zen+Kaku+Gothic+New&display=swap');
 /* Noto Sans Japanese */
.noto-sans-jp-normal-thin { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 100; font-style: normal; }
.noto-sans-jp-normal-extra-light { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 200; font-style: normal; }
.noto-sans-jp-normal-light { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 300; font-style: normal; }
.noto-sans-jp-normal-regular { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; }
.noto-sans-jp-normal-medium { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 500; font-style: normal; }
.noto-sans-jp-normal-semibold { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 600; font-style: normal; }
.noto-sans-jp-normal-bold { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 700; font-style: normal; }
.noto-sans-jp-normal-extra-bold { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 800; font-style: normal; }
.noto-sans-jp-normal-black { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 900; font-style: normal; }
.noto-sans-jp-italic-thin { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 100; font-style: italic; }
.noto-sans-jp-italic-extra-light { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 200; font-style: italic; }
.noto-sans-jp-italic-light { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 300; font-style: italic; }
.noto-sans-jp-italic-regular { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: italic; }
.noto-sans-jp-italic-medium { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 500; font-style: italic; }
.noto-sans-jp-italic-semibold { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 600; font-style: italic; }
.noto-sans-jp-italic-bold { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 700; font-style: italic; }
.noto-sans-jp-italic-extra-bold { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 800; font-style: italic; }
.noto-sans-jp-italic-black { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 900; font-style: italic; }
/* Noto Serif Japanese */
.noto-serif-jp-normal-extra-light { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 200; font-style: normal; }
.noto-serif-jp-normal-light { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 300; font-style: normal; }
.noto-serif-jp-normal-regular { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; }
.noto-serif-jp-normal-medium { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 500; font-style: normal; }
.noto-serif-jp-normal-semibold { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 600; font-style: normal; }
.noto-serif-jp-normal-bold { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 700; font-style: normal; }
.noto-serif-jp-normal-extra-bold { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 800; font-style: normal; }
.noto-serif-jp-normal-black { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 900; font-style: normal; }
.noto-serif-jp-italic-extra-light { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 200; font-style: italic; }
.noto-serif-jp-italic-light { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 300; font-style: italic; }
.noto-serif-jp-italic-regular { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 400; font-style: italic; }
.noto-serif-jp-italic-medium { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 500; font-style: italic; }
.noto-serif-jp-italic-semibold { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 600; font-style: italic; }
.noto-serif-jp-italic-bold { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 700; font-style: italic; }
.noto-serif-jp-italic-extra-bold { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 800; font-style: italic; }
.noto-serif-jp-italic-black { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 900; font-style: italic; }
/* Zen Kaku Gothic New */
.zen-kaku-gothic-new-regular { font-family: "Zen Kaku Gothic New", sans-serif; font-weight: 400; font-style: normal; }

.clearfix:after { content: ""; display: block; clear: both; } 
.clearfix:before { content: ""; display: block; clear: both; } 
.clearfix { display: block; }

 body { margin: 0; padding:0; background: #f0f0f0; }
 #Wapper { margin: 0 auto; padding:0; max-width:740px; height:auto;  background: #fff;  }
 
.ph { display:block; aspect-ratio: 370 / 77; width:100%; height:auto; margin: 0; padding:0; background: #fff; }
.ph picture { display:block; width:22%; height:auto; margin: 0; padding:0 39%; text-align:center; vertical-align: middle;}
.ph picture source, 
.ph picture img { aspect-ratio: 17/ 15; max-height:150px; height:auto; margin: 0 auto; padding:0; }



.mv { display:block; aspect-ratio: 185 / 181; width:100%; height:auto; margin: 0; padding:0; position:relative; overflow: hidden; }
.mv .visual { display:block; aspect-ratio: 185 / 181; width:100%; height:auto; margin: 0; padding:0; position:absolute; z-index:1; top:0; left:0; }
.mv .keyword { display:block; width:100%; height:auto; margin: 0; padding:17vh 0 0 0 ; position:absolute; z-index:2; top:0; left:0; color: #fff;}
.mv .keyword .block { display:block;line-height:1em; margin: 0; padding:13px 0 0 8.5%;font-weight:700; letter-spacing: 2px; font-size: 4.5rem; }
.mv .keyword .block.end { padding-top:34px; }
.mv .keyword .block span { display:inline-block; margin: 0; padding:0; padding-right:2px; }
.mv .keyword .block .small { display:inline-block;line-height:1.9em;font-weight:700;font-size: 0.76em; }
.mv .keyword .block .letter-spacing { margin-left: -0.2em; margin-right: -0.2em; }


.cp-catch { display:block; aspect-ratio: 740 / 423; width: 90% ; height:auto; margin: 8% 5%; padding:0; background: #fff; font-size:1rem; color: #666; }
.cp-catch .inbox { display:block; aspect-ratio: 55 / 24; width: 100%; height: auto; margin: 0 auto; padding: 0; }
.cp-catch .inbox .grid-box { display: grid; width: auto; height: auto; grid-template-areas: "left mid right"; grid-template-columns: 18.2% 63.6% 18.2%; grid-template-rows: auto; gap: 0px;}
.cp-catch .inbox .grid-box .left { grid-area: left; width:auto; display: block; }
.cp-catch .inbox .grid-box .right { grid-area: right; width:auto; display: block; }
.cp-catch .inbox .grid-box .side { text-align: center; }
.cp-catch .inbox .grid-box .side picture,
.cp-catch .inbox .grid-box .side source,
.cp-catch .inbox .grid-box .side img { width:100%; height:auto; margin: 0 auto; padding:0; }
.cp-catch .inbox .grid-box .middle { grid-area: mid; width:auto; display: block; }
.cp-catch .inbox .grid-box .middle .block {display: block; line-height:1.0em; margin: 0; padding:0;letter-spacing: 0.2em; font-size: 4rem; text-align : center; }
.cp-catch .inbox .grid-box .middle .block:nth-child(2) {padding:30px 0; }
.cp-catch .inbox .middle .block span { display:inline-block; margin: 0; padding:0; padding-right:2px; }
.cp-catch .inbox .middle .block .small { display:inline-block; line-height:1em; font-size: 0.7em; letter-spacing: 0; }
.cp-catch .inbox .middle .block .sub { font-size: 0.86em; letter-spacing: -2px; }
.cp-catch .inbox .middle .block .accent { font-size: 1.4em; line-height: 1em; color: #E3CA07; letter-spacing: 0; padding: 0 0.2em; }
.cp-catch .inbox .middle .block .letter-spacing { margin-left: -0.2em; margin-right: -0.2em; }


 /* noto Serif JP */
.cp-head-sock { display:block; width:100%; height:auto; margin: 0; padding:0; text-align: center; }
.cp-head { display:block; aspect-ratio: 185 / 98; width:100%; height:auto; margin: 0; padding:0; background: #304D8C; }
.cp-head .inbox { display:block; aspect-ratio: 17 / 9; width: 92%; height: auto; margin: 0; padding: 4%; }
.cp-head .inbox .grid-box { display: grid; width: 100%; height: auto; grid-template-areas: "left mid right"; grid-template-columns: 10% 80% 10%; grid-template-rows: auto; gap: 0px;}
.cp-head .inbox .grid-box .left { grid-area: left; width:auto;  }
.cp-head .inbox .grid-box .right { grid-area: right; width:auto; }
.cp-head .inbox .grid-box .side { text-align: center; }
.cp-head .inbox .grid-box .side picture,
.cp-head .inbox .grid-box .side source,
.cp-head .inbox .grid-box .side img { width:100%; height:auto; margin: 0 auto; padding:0; }
.cp-head .inbox .grid-box .middle { grid-area: mid; width:auto; display: block; }
.cp-head .inbox .grid-box .middle .block {display: block; line-height:1em; margin: 0; padding:0; letter-spacing: 0.3em; font-size: 4rem; text-align : center; color: #fff; }
.cp-head .inbox .middle .block span { display:inline-block; margin: 0; padding:0; padding-right:2px; }
.cp-head .inbox .middle .block .small { font-size: 0.7em; line-height: 0.8em; letter-spacing: -2px; }
.cp-head .inbox .middle .block .sub { font-size:1.0em; line-height: 1em; letter-spacing: -2px; }
.cp-head .inbox .middle .block .impact {font-size: 1.3em; background: linear-gradient(90deg,#FFE969, #F6E59D 47%,#FFF2A6); background: -webkit-linear-gradient(90deg,#FFE969, #F6E59D 47%,#FFF2A6);-webkit-background-clip: text;-webkit-text-fill-color: transparent; line-height: 1em; letter-spacing: 0.2em; }
.cp-head .inbox .middle .block .accent { font-size: 2.7em; margin-left: -4px; margin-right: -4px; line-height: 0.9em;}
.cp-head .inbox .middle .block .letter-spacing-l { margin-left: -0.5em; margin-right: 0; }
.cp-head .inbox .middle .block .letter-spacing-r { margin-left: 0; margin-right: -0.5em; }


.cp-products-sock { display:block; width:100%; height:auto; margin: 0; padding:0; text-align:center; background: #fff; }
.cp-products-sock::before { content: " "; display: inline-block; background: #304D8C; height: 64px; width: 180px; clip-path: polygon( 0 0, 100% 0 , 50% 100% ); margin: -2px auto 0 auto; }
 
.cp-campaign { display:block; width:100%; height:auto; margin: 0; padding:1.3em 0 2.6em 0; }
 
.cp-products-sock .cp-products {display:block; width:100%;height:auto; margin: 0; padding:0; background: #fff; color: #525252;}
.cp-products .inbox { display:block; width: 70%; height: auto; margin: 0 auto; padding: 8.2em 15% 6em 15%; }
.cp-products .inbox .caps-box { display:block; font-size: 2.2em; line-height: 1em; }
.cp-products .caps-box h2.caps { display:block; margin: 0; padding:0; border-bottom: 2px solid #525252; text-align: center; }
.cp-products .caps-box h2.caps .block { display:inline-block; padding-bottom: 1.4rem; }
.cp-products .caps-box h2.caps .block .sub {display: inline-block; font-size: 0.8em; line-height: 1.0em; letter-spacing: 0.5em; }
.cp-products .caps-box strong.block { display:block; margin: 0; padding:0; width:100%; background: none; padding-top: 1.2em; }
.cp-products .caps-box strong.block .grid-box { display: grid; width: 100%; height: auto; grid-template-areas: "left right"; grid-template-columns: 63% 37%; grid-template-rows: auto; gap: 0px; vertical-align: bottom; align-items: baseline; }
.cp-products .caps-box strong.block .grid-box .left { grid-area: left; width:auto; text-align: left; font-size:1.1em; line-height: 1.0em; letter-spacing: 1px; }
.cp-products .caps-box strong.block .grid-box .right { grid-area: right; width:auto; text-align: right; font-size: 0.48em; line-height: 1.0em; letter-spacing: 1px; }
.cp-products .caps-box .block {display: inline-block; line-height:1em; margin: 0; padding:0; width: 100%; }
.cp-products .caps-box .nega { display:inline-block; background: #525252; color: #fff; margin: 1em 0 0 0; padding: 0.6em 0; font-size: 0.4em; line-height: 1.0em; letter-spacing: 1px;  } 
.cp-products .caps-box .nega span { font-size: 1.2em; } 
.cp-products .caps-box .nega span span { font-size: 1em; }  
.cp-products .caps-box .nega .letter-spacing { margin-left: -0.2em; margin-right: -0.2em; }
 
.cp-products .inbox.img-box { margin:0; padding: 4em 0 0 0; }
.cp-products .inbox .img-01 { display:block; aspect-ratio: 60 / 37; width:100%; height:auto; margin-top:2.4em; }
.cp-products .inbox .img-01 source, 
.cp-products .inbox .img-01 img { width:100%; height:auto; } 
.cp-products .inbox .img-02 { display:block; aspect-ratio: 62 / 53; width:100%; height:auto; margin-top:4.4em; }
.cp-products .inbox .img-02 source, 
.cp-products .inbox .img-02 img { width:100%; height:auto; } 
.cp-products .inbox .info-box { font-size: 1em;   padding-top: 3em; }
.cp-products .inbox .info-box table { margin:0; padding:0; width:100%; border-bottom:2px solid #525252; border-right: 2px solid #525252; border-spacing: 0px; }
.cp-products .inbox .info-box table caption { margin:0; padding: 0.15em 0; width: calc( 100% - 4px ); letter-spacing:1em; font-weight:700; border:2px solid #525252; border-bottom: 0px solid #525252; }
.cp-products .inbox .info-box table tr { margin:0; padding:0; }
.cp-products .inbox .info-box table th,
.cp-products .inbox .info-box table td { margin:0; padding: 0.15em 0.5em; border-top: 2px solid #525252; border-left: 2px solid #525252; }
.cp-products::after { content: " "; display: block; margin: 0 auto -62px auto; background: #fff; height: 64px; width: 180px; clip-path: polygon( 0 0, 100% 0 , 50% 100% );  }

 
 /* noto Serif JP */
.cp-campaign-sock{ display:block; width:100%; height:auto; margin: 0; padding:0 0 2.6em 0; background: #304D8C; }
/*
.cp-campaign-sock::before { content: " "; display: block; margin: -2px auto 0 auto; background: #fff; height: 64px; width: 180px; clip-path: polygon( 0 0, 100% 0 , 50% 100% );  }
*/
 
.cp-campaign { display:block; width:100%; height:auto; margin: 0; padding:4em 0 2.6em 0; }
 
.cp-campaign .inbox { display:block; aspect-ratio: 17 / 9; width: 92%; height: auto; margin: 0; padding: 4%; }
.cp-campaign .inbox .grid-box { display: grid; width: 100%; height: auto; grid-template-areas: "left mid right"; grid-template-columns: 10% 80% 10%; grid-template-rows: auto; gap: 0px;}
.cp-campaign .inbox .grid-box .left { grid-area: left; width:auto; margin-top: 1.3em; }
.cp-campaign .inbox .grid-box .right { grid-area: right; width:auto; margin-top: 1.3em; }
.cp-campaign .inbox .grid-box .side { text-align: center; }
.cp-campaign .inbox .grid-box .side picture,
.cp-campaign .inbox .grid-box .side source,
.cp-campaign .inbox .grid-box .side img { width:100%; height:auto; margin: 0 auto; padding:0; }
.cp-campaign .inbox .grid-box .middle { grid-area: mid; width:auto; display: block; }
.cp-campaign .inbox .grid-box .middle .block {display: block; line-height:1.0em; margin: 0; padding:0;letter-spacing: 0.2em; font-size: 5rem; text-align : center; vertical-align: bottom; align-items: baseline; }
.cp-campaign .inbox .middle .block span { display:inline-block; margin: 0; padding:0; padding-right:2px; }
.cp-campaign .inbox .middle .block .small { display:inline-block; line-height:1em; font-size: 0.7em; letter-spacing: 0;  vertical-align: top; align-items: top; padding-top: 0.8em; }
.cp-campaign .inbox .middle .block .sub { font-size: 0.86em; letter-spacing: -2px; }
.cp-campaign .inbox .middle .block .accent { font-size: 1.6em; line-height: 1em; color: #E3CA07; letter-spacing: 0; padding: 0 0.05em 0 0.12em; }
.cp-campaign .inbox .middle .block .letter-spacing { margin-left: -0.2em; margin-right: -0.2em; }
.cp-campaign .inbox .middle .block.impact { font-size: 5.2em; background: linear-gradient(90deg,#FFE969, #F6E59D 47%,#FFF2A6); background: -webkit-linear-gradient(90deg,#FFE969, #F6E59D 47%,#FFF2A6);-webkit-background-clip: text;-webkit-text-fill-color: transparent; }
.cp-campaign .inbox .grid-box .middle .block:nth-child(2) {padding:0; font-size: 6.5em; letter-spacing: 0.1em; }
.cp-campaign .inbox .grid-box .middle .big-price {}
.cp-campaign .inbox .grid-box .middle .big-price .point { margin: 1.6em 0 0 1.6em; padding:0; text-align:left; font-size: 1.9em; letter-spacing: 0.15em; color: #fff; }
.cp-campaign .inbox .grid-box .middle .big-price .grid-box { display: grid; width: 100%; height: auto; grid-template-areas: "left right"; grid-template-columns: 80% 20%; grid-template-rows: auto; gap: 0px;}
.cp-campaign .inbox .grid-box .middle .big-price .grid-box .left { grid-area: left; width:auto; text-align: center; font-size: 16em; letter-spacing: -0.04em; line-height: 0.9em; }
.cp-campaign .inbox .grid-box .middle .big-price.total-price .grid-box .left { line-height: 1.1em; }
.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right { grid-area: right; width:auto; text-align: right; font-size: 1rem; line-height: 1rem; letter-spacing: 0rem; }
.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right span { display: inline-block; width: 100%; margin: 0; padding: 0; line-height: 1em; font-size: 1em; letter-spacing: 0em; }
.cp-campaign .inbox .grid-box .middle .total-price { padding-top: 2rem; }
.cp-campaign .inbox .grid-box .middle .total-price::before { content: " "; display:block; height: 16px; width: 100%; margin: 0; padding: 0; background-image: linear-gradient(90deg, #304D8C 0%, #D1B12D 20%, #F6E59D 47%, #D1B12D 82%, #304D8C 100%); }
.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .no-tax { padding-top: 2.5em; font-size: 2.5em; letter-spacing: -0.01rem; line-height: 1rem; }
.cp-campaign .inbox .grid-box .middle .big-price .grid-box .left .total { font-size: 0.65em; letter-spacing: -0.01em; line-height: 1em; vertical-align: top; align-items: top; margin-top: 2rem; }
.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .with-tax { padding-top: 3em; font-size: 2em; letter-spacing: -0.01rem; line-height: 1rem; }
.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .note { padding-top: 1.5rem; font-size: 3em; letter-spacing: -0.01rem; line-height: 1rem; }
.cp-campaign .inbox .grid-box .middle .sales-keyword {width:auto; text-align: center; font-size: 1rem; letter-spacing: 0rem; line-height: 1rem; }
.cp-campaign .inbox .grid-box .middle .sales-keyword .block {width:auto; text-align: center; font-size: 7em; letter-spacing: -0.01em; line-height: 0.9em; padding-bottom: 1.5rem;}
 
.cp-campaign .surprise-point { display: block; width:100%; color: #fff; }
 .cp-campaign .surprise-point h2 { display: block; margin: 3.3rem 9%; padding: 0; width: auto; height: auto; text-align: center; }
.cp-campaign .surprise-point h2 .sockets { display: inline-block; margin:0 9% 0 9%; padding: 0; width: auto; height: auto; text-align: center; } 
.cp-campaign .surprise-point h2 .sockets .caps-block { font-size: 2.4em; line-height: 1em; letter-spacing: 0.04em; color: #fff; padding-bottom: 2.2rem; display: inline-block; text-align: center; } 
.cp-campaign .surprise-point h2 .sockets::after { content: " "; display: inline-block; background: #fff; margin: 0 9%; height: 48px; width: 82%; clip-path: polygon( 0 0, calc( 38% + 2px ) 0 , 50% calc( 100% - 6px), calc( 62% - 2px ) 0, 100% 0,  100% 4px, 62% 4px, 50% 100%, 38% 4px, 0 4px ); } 



.cp-campaign .surprise-point .big-surprise { display:block; width: 100%; margin: -9% auto 0 auto; padding: 0; }
 .cp-campaign .surprise-point .big-surprise .base { display: block; aspect-ratio: 74 / 55; width: 86%; height: auto; margin:0; padding:0; position:relative; z-index: 1; } 
.cp-campaign .surprise-point .big-surprise .base::before { content: " "; display: block; aspect-ratio: 1 / 1; width: 100%; height: auto;  height: auto; margin:0; padding:0; border:10px solid transparent; border-radius: 50%; background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 15%, rgba(255, 255, 255, 1) 40%, #fff ) border-box border-box; -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0) border-box; -webkit-mask-composite: destination-out; mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0) border-box; mask-composite: exclude; position:absolute; top: 0; left: 5%; z-index: 2; }
 .cp-campaign .surprise-point .big-surprise .base .point { display: block; aspect-ratio: 1 / 1; max-width: 540px; width: 100%; height: auto; margin:0 auto; padding:0; position:absolute; top: 0; left: 5%; z-index: 3; }
 
.cp-campaign .surprise-point .big-surprise .base .keyword { display:block; width:100%; margin: 1.1em 0 0.4em 0; padding: 0; font-size: 3em; text-align:center; }
.cp-campaign .surprise-point .big-surprise .base .grid-box{ display: grid; width: 100%; height: auto; margin:0 auto; padding:0; grid-template-areas: "left right"; grid-template-columns: 60% 40%; grid-template-rows: auto; gap: 0px; }
.cp-campaign .surprise-point .big-surprise .base .grid-box .left { grid-area: left; width:auto; text-align: center; font-size: 10em; letter-spacing: -0.01em; line-height: 0.9em; text-align:right; }
.cp-campaign .surprise-point .big-surprise .base .grid-box .right { grid-area: right; width:auto; text-align: right; font-size: 1rem; line-height: 1rem; letter-spacing: 0rem; text-align:left; }
.cp-campaign .surprise-point .big-surprise .base .grid-box .right .block { display: inline-block; width: 100%; height: auto; margin:0 auto; padding:0; }
.cp-campaign .surprise-point .big-surprise .base .grid-box .right .block .caution { display: inline-block; width: 100%; height: auto; margin:1em auto 0 auto; padding:0 0 0 1em; font-size: 3em;}
.cp-campaign .surprise-point .big-surprise .base .grid-box .right .block .parcent { display: inline-block; width: 100%; height: auto; margin:0 auto; padding:0 0 0 0.2em; font-size: 8em; line-height: 1.3em; }
.cp-campaign .surprise-point .big-surprise .accent-key {display: block; width: 100%; height: auto; margin:0.3em 0 0 0.7em; padding:0; font-size:4em; text-align: right; letter-spacing: -0.1em; }

 
.cp-campaign .surprise-point-note {display: block; width: auto; height: auto; margin:2em 5% 0 5%; padding: 1.2em 0.7em; font-size:2.2em; letter-spacing: -0.04em; text-align: left; border-radius: 24px; border: 3px solid #fff; color: #fff; line-height: 1.6em; font-weight: 500; }
.cp-campaign .surprise-point-note .mb1{ margin-bottom: 1.5em; }
.cp-campaign .surprise-point-note ul { display:block; margin: 0; padding: 0; }
.cp-campaign .surprise-point-note ul li { display:block; padding-left: 1em; text-indent: -1em; }
.cp-campaign .surprise-point-note ul li::before { content: "・"; }


.corp-message { display: block; margin: 0 auto; padding:4rem 0; width: 100%; height: auto; text-align: center;  background: #fff; color: #525252;  }
.corp-message picture { display:block; aspect-ratio: 370 / 77; width:100%; height:auto; margin: 0; padding:0; text-align:center; vertical-align: middle;}
.corp-message picture source, 
.corp-message picture img { aspect-ratio: 17/ 15; max-width:170px; height:auto; margin: 0 auto; padding:0; }
.corp-message .block { display: inline-block; margin: 0 auto; padding:0; width: 100%; height: auto; text-align: center; font-weight: 500; }
.corp-message .large { padding:5.2rem 0; font-size: 3.6em; line-height: 1em; }
.corp-message .middle {font-size: 0.7em; line-height: 1em;}
.corp-message .small {font-size: 0.6em; line-height: 1em;}
.corp-message .sub { padding: 0 0 2rem 0; font-size: 3.4em; line-height: 1em; }
.corp-image { display: block; margin: 0 auto; padding:0; aspect-ratio: 135/ 112; max-width:740px; width: 100%; height: auto; text-align: center; }



.cta { display: block; margin: 0 auto; padding:1em 0; width: calc( 100% - 2em ); height: auto; text-align: center; background: #fff;}
.cta ul.points { display: block; width;90%; margin: 0 auto; padding:0 5%; }
.cta ul li { display: block; margin: 0 auto; padding:0; aspect-ratio: 370 / 219; max-width: 740px; width: 100%; height: auto; text-align: center; }
.cta ul li picture { display:block; aspect-ratio: 370 / 179; max-width: 740px; width:100%; height:auto; margin: 0; padding:0; text-align:center; vertical-align: middle;}
.cta ul li.with-memo picture { margin-bottom: 0; }
.cta ul li.with-memo span.memo { display:block; font-size: 1.5em; aspect-ratio: 740 / 70; width: 100%; left: 0; color #666; line-height: 1.5em; } 
.cta ul li.with-memo span.memo .txt { display:block; margin:0 16%; padding: 0; } 
.cta ul li.no-memo picture { margin-bottom: 80px; }
.cta ul li.with-separator { aspect-ratio: 185 / 114; height: auto; }
.cta ul li.with-separator::before { content:" "; display:block; aspect-ratio: 370 / 9; max-width: 740px; width:100%; height:auto; margin: 0; padding:0; background: url(../../img/002/cta-point-separator-sp.webp) top left no-repeat; background-size:cover; } 

.cta ul li.cta-bottun { display:block; max-width: 740px; width:91%; height:auto; margin: 4em 4.5%; padding:0; text-align:center; } 
.cta ul li.cta-bottun a { display:inline-block; width:auto; height:auto; margin: 0; padding:0 0 4px 0; text-align:center; } 
.cta ul li.cta-bottun picture { display:block; aspect-ratio: 325 / 227; max-width: 650px; width:100%; height:auto; margin: 0; padding:0; text-align:center; vertical-align: middle;}
.cta ul li.cta-bottun picture source, 
.cta ul li.cta-bottun picture img { width:100%; height:auto; } 

.worries { background: url(../../img/002/worries-dot-pc.webp) top left ; }
.worries .inbox{} 
.worries h2 {display:block; aspect-ratio: 185 / 82; max-width: 740px; width:100%; height:auto; margin: 0; padding:0; text-align:center; vertical-align: middle; font-size: 4em; color: #fff; background: #4975AE; }
.worries h2 span.tc {display:block; width: 100%; height: auto; margin: 0; padding:4rem 0; text-align: center; }
.worries span.block{display:inline-block; width: 100%;margin: 0; padding:1.5rem 0; text-align: center; } 
.worries ul { display:block; width: 100%; margin: 0 0 -10px 0; padding: 0; font-size: 1em; position: relative; } 
.worries ul li { display:block; width: 100%; margin: 0; padding:0; text-align: center; font-size: 2.4em; }
.worries ul li span.block{ padding:0.5rem 0; } 
.worries ul li.worries01 { display: inline-block; aspect-ratio: 370 /149; max-width: 740px; width:100%; height:auto; margin: -1.2rem 0 0 0; padding:0; background: url(../../img/002/worries-01-pc.webp) top left no-repeat; background-size:cover; }
.worries ul li.worries01 .sock { display:inline-block; margin: 0; padding: 2.5rem 14rem 0 0; }
.worries ul li.worries02 { display: inline-block; aspect-ratio: 370 /153; max-width: 740px; width:100%; height:auto; margin: -4.2rem 0 0 0; padding:0; background: url(../../img/002/worries-02-pc.webp) top left no-repeat; background-size:cover; color: #fff;  }
.worries ul li.worries02 .sock { display:inline-block; margin: 0; padding: 2.5rem 0 0 14rem; }
.worries ul li.worries03 { display: inline-block; aspect-ratio: 185 /71; max-width: 740px; width:100%; height:auto; margin: -5.0rem 0 0 0; padding:0; background: url(../../img/002/worries-03-pc.webp) top left no-repeat; background-size:cover; }
.worries ul li.worries03 .sock { display:inline-block; margin: 0; padding: 2.5rem 14rem 0 0; }
.worries ul li.worries04 { display: inline-block; aspect-ratio: 740 /289; max-width: 740px; width:100%; height:auto; margin: -3.2rem 0 0 0; padding:0; background: url(../../img/002/worries-04-pc.webp) top left no-repeat; background-size:cover; color: #fff; }
.worries ul li.worries04 .sock { display:inline-block; margin: 0; padding: 2.5rem 0 0 14rem; }
.worries ul::after { content: " "; display: inline-block; aspect-ratio: 370 /181; max-width: 740px; width:100%; height:auto; margin: -244px 0 0 0; padding:0; background: url(../../img/002/worries-chara-pc.webp) top left no-repeat; background-size:cover; position: relative; bottom:0;}




 .case {display:block; width: 100%; height: auto; margin: 0; padding: 0; text-align: left;	background: #E4EFF1; margin-top:-2px;	 } 
 .case h2 { display:block;width:100%; height:auto; margin: 0; padding:0; text-align:center; vertical-align: middle; font-size: 4em; color: #525252; font-size:3em; text-align: center; }
.case span.block{display:inline-block; width: 100%;margin: 0; padding:2.5em 0; text-align: center; } 
.case ul.case-list {display:inline-block;  width: 90%; margin: 0; padding:1.5rem 5%; text-align: left; }
.case ul.case-list li { display:block; width: 100%; margin: 0; padding: 0 0 2em 0;  }
.case dl.case-detail { display:block; width: 100%; margin: 0; padding: 3rem 0; border-radius: 24px; border: 3px solid #4975AE; font-weight:600; background:#fff;  }
.case dl.case-detail.case01 dt { display:block; aspect-ratio: 669 / 140;  max-width: 669px; width: auto; height: auto; margin: 0 auto; padding: 0; background: url(../../img/002/case-01-pc.webp) top left no-repeat; background-size:cover; overflow: hidden; }
.case dl.case-detail.case02 dt { display:block; aspect-ratio: 669 / 140;  max-width: 669px; width: auto; height: auto; margin: 0 auto; padding: 0; background: url(../../img/002/case-02-pc.webp) top left no-repeat; background-size:cover; overflow: hidden; }
.case dl.case-detail dd {display:block;  width: calc( 100% - 6rem ); height: auto; margin: 0 ; padding: 0 3rem; }
.case dl.case-detail dt .caption-keyword {display:block; width: auto; height: auto; margin: 0; padding: 0 3rem; color: #4975AE; font-size:2em; font-weight:900; }
.case dl.case-detail dt .caption-title {display:block; width: auto; height: auto; margin: 0; padding: 0 3rem 3rem 3rem; color: #525252; font-size:3.6em; }
.case dl.case-detail dd .case-detail-block {display:block; width: auto; height: auto; margin: 0 ; padding: 1.5rem 0 ; color: #525252; }
.case dl.case-detail dd .case-detail-block .ok {display:block; width: 80%; height: auto; margin: 0; padding: 0 10% 1.5rem 10%; text-indent:-1em; color: #4975AE; font-size:2.9rem; line-height: 1.2em; }
.case dl.case-detail dd .case-detail-block .but {display:block;width: 78%; height: auto; margin: 0; padding: 0 10% 1.5rem 12%;text-indent:0em;  color: #797A7B; font-size:2em; line-height: 1em; }
.case dl.case-detail dd .case-detail-block .ng {display:block; width: 80%; height: auto; margin: 0; padding: 0 10% 1.5rem 10%; text-indent:-1em;  color: #C20606; font-size:2.9rem;  line-height: 1.2em; }
.case dl.case-detail dd .case-detail-block + .case-detail-block {border-top: 3px solid #A9A9A9; padding-top: 1.5rem; }


.cp-product-effects { display:block; width: 100%; height: auto; margin: 0; padding: 0; text-align: left;	background: #fff; margin-top:-2px;	 }
.cp-product-effects::before { content: " "; display: inline-block; aspect-ratio: 37 / 6;  max-width: 740px; width: 100%; height: auto; margin: 0 auto; padding: 0; clip-path: polygon( 0 0, 100% 0 , 50% 100% ); margin:0; background: #E4EFF1; }
 
 .cp-product-effects h2 { display:block;width:100%; height:auto; margin: 8rem 0 0 0; padding:0; text-align:center; vertical-align: middle; font-size: 3.6em; color: #385B9B; text-align: center; }

.pr-img { display:block;width:100%; height:auto; margin: 0; padding: 3rem 0; text-align:center; vertical-align: middle; text-align: center; }
.pr-img .visual { display:block; aspect-ratio: 275 / 206; max-width:550px; width:100%; height:auto; margin: 0 auto; padding:0; text-align:center; }
.pr-img .visual source, 
.pr-img .visual img { width:100%; height:auto; } 
 
.cp-product-effects ul.merit { display:block; width: 100%; height:auto; margin: 0 ; padding:0; text-align:left; vertical-align: middle; color: #4975AE; font-size:3em; line-height:1.5em;}
.cp-product-effects ul.merit li { display:block; width: auto; height: auto; margin: 0; padding: 0 12.8% 2rem 12.8%; text-indent: -1em; } 
.cp-product-effects ul.merit li span { display:block; margin: 0; padding: 0 0 0 1rem; font-weight: 600; } 
.cp-product-effects ul.merit li span::before { content: "◯ "; display:inline; margin: 0; padding: 0 0 0.5em 0; } 
.cp-product-effects ul.merit li strong { background: linear-gradient(transparent 60%, #FFFCB1 60%); font-weight: 600; } 
 
 
 .cp-product-effects .strong-message { display:block;width:100%; height:auto; margin: 0; padding: 4rem 0; text-align:center; vertical-align: middle; font-size: 3.6em; color: #385B9B; text-align: center; line-height: 1.5em; font-weight: bold; }
 
.cp-product-effects .logo-sock { display:block;width:100%; height:auto; margin: 0; padding: 2rem 0 8rem 0; text-align:center; vertical-align: middle; text-align: center; }
.cp-product-effects .logo-sock picture { display:block; aspect-ratio: 4 / 3; max-width:200px; width:100%; height:auto; margin: 0 auto; padding:0; text-align:center; } 



.event-info { display:block; width: 100%; height: auto; margin: 0; padding: 0; text-align: left;	background: #fff; margin-top:-2px; font-size: 1rem;  text-align: center; }
.event-info h2 { display:block;width:100%; height:auto; margin: 0; padding: 1em 0; text-align:center; vertical-align: middle; font-size: 3.6em; background-image: linear-gradient(90deg, #2176B2 0%, #0B619E 100%); color: #fff; line-height:1.3em; }
 .event-info div.read { display:block;width:calc( 100% - 2.4em ); height:auto; margin: 0; padding: 1.2em; text-align:center; vertical-align: middle; font-size: 2.4em; color: #525252; text-align: left;  line-height:1.3em; }
 
.event-info ul { display:block;width:100%; height:auto; margin: 0; padding:0; text-align:left; }
.event-info ul li { display:block;width:100%; height:auto; margin: 0; padding:0; text-align:left; }
.event-info dl.grid-box { display: grid; width: 100%; height: auto; margin:0; pading:0; grid-template-areas: "left right"; grid-template-columns: 16% 84%; grid-template-rows: auto; gap: 0px;  letter-spacing:0.1em; }
.event-info dl.grid-box dt.left { grid-area: left; width:auto; margin-top: 1.3em; }
.event-info dl.grid-box dt .caps { display:table; aspect-ratio: 1 / 1; width:100%; height:auto; font-size:0.6em; font-weight: bold; text-align: center; vertical-align: middle; }
.event-info dl.grid-box dt .caps .sock {display:table-cell; aspect-ratio: 1 / 1; width:100%; height:auto; font-size:1.6em; font-weight: bold; text-align:center; vertical-align: middle; background: #0467AE; color: #fff;}
.event-info dl.grid-box dd.right { grid-area: right; width:auto; margin-top: 1.3em; } 
.event-info dl.grid-box dd .box { display:block; }
.event-info dl.grid-box dd .main { font-size: 1.2em; font-weight: 700; }
.event-info dl.grid-box dd .sub { font-size: 0.9em; font-weight: 700;}
.event-info dl.grid-box dd .small { font-size: 0.7em; font-weight: 500;}
.event-info dl.grid-box dd .normal-weight { font-weight: 400;}
.event-info dl.grid-box dd .colored { color: #0467AE; }




.form-info { display:block; width: 100%; height: auto; margin: 0; padding: 0; text-align: left;	background: #fff; margin-top:-2px; font-size: 1rem;  text-align: center; }
.form-info h2 { display:block;width:100%; height:auto; margin: 0; padding: 1em 0; text-align:center; vertical-align: middle; font-size: 3.6em; background:#26BD00; color: #fff; line-height:1.3em; }
.form-info h2 .sub { font-size: 0.7em; line-height: 1em; text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.2);}
.form-info h2 .main { font-size: 0.9em; line-height: 1em; text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.2); }

.form-info .form-items label { display: inline-block; font-weight: 400; color:#000; padding-top:1em; padding-bottom:1em; border-top: 3px solid #BFBFBF; width:100%; clear:both;  }
.form-info .form-items li:nth-child(1) label { border-top: 0px solid #BFBFBF; }

.form-info .form-items { padding: 0 3em 3em 3em; font-size: 1.2em; text-align: left; line-height:2em; }
.form-info .form-items input,
.form-info .form-items textarea,
.form-info .form-items select { font-size: 1.2em; border:#ccc; background: #f0f0f0; padding: 0.8em; max-width:100%; border-radius: 12px; }

.form-info .wpcf7-submit {  font-size: 1.5em; border:#ccc;  padding: 1em; max-width:90%; border-radius: 48px; background:#0467AE; color: #fff;   }

.form-info .form-items label .require { padding-left: 1em; font-size: 1em; color: #900; float: right; }
.form-info .form-items label  .elective { padding-left: 1em; font-size: 1em; color: #009; float: right;  }
.form-info .form-items .note {  font-size: 0em; color: #666; }


.form-info .form-items  li { padding-bottom: 1.5em; }
.form-info .form-items + p {padding-bottom:3em; }
.form-info .form-items .wpcf7-checkbox span.wpcf7-list-item { display:block; }

.form-info .screen-reader-response {padding: 1.5em 1.5em 0 1.5em; font-size:1.2em; line-height:1.5em; background: #fff; }



.logo-bar { font-size : 3.6em; padding-top:8em; padding-top:2em;  }
.logo-bar .logo-sock { display:table; aspect-ratio: 370 / 77; width:100%;  height:auto; margin: 0; padding:0; background: #fff; }
.logo-bar .logo-sock picture { display:table-cell; aspect-ratio: 370 / 77; width:100%;  height:auto; margin: 0; padding:0; text-align:center; vertical-align: middle;}
.logo-bar .logo-sock picture source, 
.logo-bar .logo-sock picture img  { aspect-ratio: 17/ 15; max-width:170px;  height:auto; margin: 0 auto; padding:0; }

footer { font-size: 1rem; margin: 0 auto; padding: 0; max-width:740px; height:auto; }
footer .co-detail { font-size:3em; text-align: center; line-height: 1.5em; padding-top: 1em; padding-bottom: 1em;  }
footer .co-detail { background: #4975AE; font-size:2em; color: #fff; }
footer .co-detail .co-name { display:block; font-size:0.9em;  font-weight:500; }
footer .co-detail .co-addr { display:block; font-size:0.7em; }
footer .co-detail .co-tel  { display:block; font-size:0.7em; }
footer .copyright{ background: #414141; display: block; font-size: 1.4em; text-align: center; padding: 0.5em 0; color: #FFF; }
  

picture source,
picture img { max-width: 100%; width: auto; height:auto; }




@media screen and (740px < width) {
    #Wapper,
	footer { max-width:740px; width:auto; width:auto; margin-left:auto; margin-right:auto;  }
	picture.wide, picture.wide source, picture.wide img  { width: 100%; }
}
@media (660px < width <= 740px) {
    .mv .keyword .block { font-size: clamp(4.1rem, 1vw, 4.5rem); } 
    .cp-catch .inbox .grid-box .middle .block,
    .cp-head .inbox .grid-box .middle .block { font-size: clamp(3.6rem, 1vw, 4.0em); } 
    .cp-products .inbox .caps-box { font-size: clamp(2.0rem, 1vw, 2.2em); }
    .cp-products .inbox { padding-left: 12%; padding-right: 12%;}
    .cp-campaign .inbox .grid-box .middle .big-price .grid-box .left { font-size: clamp(15.0rem, 1vw, 16em); }
    .cp-campaign .inbox .middle .block.impact { font-size: clamp(4.7rem, 1vw, 5.2rem); }
    .cp-campaign .inbox .grid-box .middle .sales-keyword { padding-top:0.2em; }
    .cp-campaign .inbox .grid-box .middle .sales-keyword .block { font-size: clamp(6.4em, 1vw, 7em); margin-top:1em; }
    .cp-campaign .inbox .middle .block .small { ont-size: clamp(0.65rem, 1vw, 0.7em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .no-tax { font-size: clamp(2.2em, 1vw, 2.5em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .with-tax { font-size: clamp(1.9em, 1vw, 2.2em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .note {font-size: clamp(2.6em, 1vw, 3.0em);}
	.cp-campaign .inbox .grid-box .middle .block:nth-child(2) {font-size: clamp(6.1em, 1vw, 6.5em);}
	.cp-campaign .inbox .grid-box .middle .big-price .point { font-size:clamp(1.6em, 1vw, 1.9em); }
	.cp-campaign .surprise-point h2 .sockets .caps-block {font-size: clamp(2.2em, 1vw, 2.4em);}
	.cp-campaign .surprise-point .big-surprise .base .keyword  { font-size: clamp(2.8em, 1vw, 3em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .left { font-size: clamp(9em, 1vw, 10em); }
	.cp-campaign .surprise-point .big-surprise .accent-key { font-size: clamp(3.7em, 1vw, 4em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .right .block .caution { font-size: clamp(2.7em, 1vw, 3em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .right .block .parcent { font-size: clamp(7.2em, 1vw, 8em); }
	.cp-campaign .surprise-point-note { font-size: clamp(2.0em, 1vw, 2.2em);}
	.worries h2 { font-size: clamp(3.9em, 1vw, 4.0em); }
	.worries ul li {  font-size: clamp(2.3em, 1vw, 2.4em); }
    .worries ul li.worries01 .sock { padding: 2.5rem 14rem 0 0; }
    .worries ul li.worries02 .sock { padding: 2.5rem 0 0 14rem; }
    .worries ul li.worries03 .sock { padding: 2.5rem 14rem 0 0; }
    .worries ul li.worries04 .sock { padding: 2.5rem 0 0 14rem; }
    .case h2 { font-size: clamp(2.7em, 1vw, 3.0em); }
    .case dl.case-detail dt .caption-title { font-size: clamp(3.3em, 1vw, 3.6em); }
    .case dl.case-detail dd .case-detail-block .ok, 
    .case dl.case-detail dd .case-detail-block .ng { font-size: clamp(2.6em, 1vw, 2.9em); }
    .case dl.case-detail dd .case-detail-block .but{ font-size: clamp(1.7em, 1vw, 2.0em); }
	.corp-message .sub,
    .cp-product-effects h2 { font-size: clamp(3.3em, 1vw, 3.6em); }
	.cp-product-effects ul.merit { font-size: clamp(2.7em, 1vw, 3.0em); }
	.cp-product-effects .strong-message { font-size: clamp(3.3em, 1vw, 3.6em); }
	.event-info div.read{ font-size: clamp(2.2em, 1vw, 2.4em); }
	.corp-message .large,
	.event-info h2,
	.form-info h2 { font-size: clamp(3.3em, 1vw, 3.6em); }
    .logo-bar { font-size: clamp(4.1rem, 1vw, 4.5rem); }
	.cta ul li.with-memo span.memo { font-size: clamp(1.34rem, 1vw, 1.5rem); }
	html body,
    #Wapper,
	footer { max-width:740px !important; width:auto;   width:auto; margin-left:auto; margin-right:auto; }
	picture.wide, picture.wide source, picture.wide img  { width: 100%; }
}
@media (600px < width <= 660px) {
    .mv .keyword .block { font-size: clamp(3.6rem, 1vw, 4.1rem); } 
    .cp-catch .inbox .grid-box .middle .block,
    .cp-head .inbox .grid-box .middle .block { font-size: clamp(3.1rem, 1vw, 3.6em); } 
    .cp-products .inbox .caps-box { font-size: clamp(1.8rem, 1vw, 2.0em); }
    .cp-products .inbox { padding-left:  9%; padding-right:  9%;}
    .cp-campaign .inbox .grid-box .middle .big-price .grid-box .left { font-size: clamp(13rem, 1vw, 15.0em); }
    .cp-campaign .inbox .middle .block.impact { font-size: clamp(4.2rem, 1vw, 4.7rem); }
    .cp-campaign .inbox .grid-box .middle .sales-keyword { padding-top:3em; }
    .cp-campaign .inbox .grid-box .middle .sales-keyword .block { font-size: clamp(5.6em, 1vw, 6.4em);  }
    .cp-campaign .inbox .middle .block .small { ont-size: clamp(0.5rem, 1vw, 0.65em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .no-tax { font-size: clamp(1.9em, 1vw, 2.2em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .with-tax { font-size: clamp(1.6em, 1vw, 1.9em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .note {font-size: clamp(2.3em, 1vw, 2.6em);}
	.cp-campaign .inbox .grid-box .middle .block:nth-child(2) {font-size: clamp(5.6em, 1vw, 6.1em);}
	.cp-campaign .inbox .grid-box .middle .big-price .point { font-size:clamp(1.3em, 1vw, 1.6em); }
	.cp-campaign .surprise-point h2 .sockets .caps-block {font-size: clamp(2.0em, 1vw, 2.2em);}
	.cp-campaign .surprise-point .big-surprise .base .keyword  { font-size: clamp(2.6em, 1vw, 2.8em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .left { font-size: clamp(8em, 1vw, 9em); }
	.cp-campaign .surprise-point .big-surprise .accent-key { font-size: clamp(3.4em, 1vw, 3.7em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .right .block .caution { font-size: clamp(2.3em, 1vw, 2.7em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .right .block .parcent { font-size: clamp(6.4em, 1vw, 7.2em); }
	.cp-campaign .surprise-point-note { font-size: clamp(1.8em, 1vw, 2.0em);}
	.worries h2 { font-size: clamp(3.5em, 1vw, 3.9em); }
	.worries ul li {  font-size: clamp(2.1em, 1vw, 2.3em); }
    .worries ul li.worries01 .sock { padding: 1.5rem 12rem 3rem 0; }
    .worries ul li.worries02 .sock { padding: 1.5rem 0  3rem 12rem; }
    .worries ul li.worries03 .sock { padding: 1.5rem 12rem  3rem 0; }
    .worries ul li.worries04 .sock { padding: 1.5rem 0  3rem 12rem; }
    .case h2 { font-size: clamp(2.3em, 1vw, 2.7em); }
    .case dl.case-detail dt .caption-title { font-size: clamp(2.9em, 1vw, 3.3em); }
    .case dl.case-detail dd .case-detail-block .ok, 
    .case dl.case-detail dd .case-detail-block .ng { font-size: clamp(2.2em, 1vw, 2.6em); }
    .case dl.case-detail dd .case-detail-block .but{ font-size: clamp(1.4em, 1vw, 1.7em); }
	.corp-message .sub,
    .cp-product-effects h2 { font-size: clamp(2.9em, 1vw, 3.3em); }
	.cp-product-effects ul.merit { font-size: clamp(2.4em, 1vw, 2.7em); }
	.cp-product-effects .strong-message { font-size: clamp(2.9em, 1vw, 3.3em); }
	.event-info div.read{ font-size: clamp(1.9em, 1vw, 2.2em); }
	.corp-message .large,
	.event-info h2,
	.form-info h2 { font-size: clamp(2.9em, 1vw, 3.3em); }
    .logo-bar { font-size: clamp(3.6rem, 1vw, 4.1rem); }
	.cta ul li.with-memo span.memo { font-size: clamp(1.2rem, 1vw, 1.34rem); }
    html body,
    #Wapper,
	footer { max-width:660px !important; width:auto;   width:auto; margin-left:auto; margin-right:auto; }
	picture.wide, picture.wide source, picture.wide img  { width: 100%; }
}
@media (540px < width <= 600px) {
    .mv .keyword .block { font-size: clamp(2.8rem, 1vw, 3.4rem); } 
    .cp-catch .inbox .grid-box .middle .block,
    .cp-head .inbox .grid-box .middle .block { font-size: clamp(2.3rem, 1vw, 3.1em); } 
    .cp-products .inbox .caps-box { font-size: clamp(1.6rem, 1vw, 1.8em); }
    .cp-products .inbox { padding-left:  5%; padding-right:  5%;}
    .cp-campaign .inbox .grid-box .middle .big-price .grid-box .left { font-size: clamp(10rem, 1vw, 13em); }
    .cp-campaign .inbox .middle .block.impact { font-size: clamp(3.7rem, 1vw, 4.2rem); }
    .cp-campaign .inbox .grid-box .middle .sales-keyword { padding-top:4em; }
    .cp-campaign .inbox .grid-box .middle .sales-keyword .block { font-size: clamp(4.6em, 1vw, 5.6em); }
    .cp-campaign .inbox .middle .block .small { ont-size: clamp(0.45rem, 1vw, 0.5em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .no-tax { font-size: clamp(1.5em, 1vw, 1.9em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .with-tax { font-size: clamp(1.3em, 1vw, 1.6em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .note {font-size: clamp(1.8em, 1vw, 2.3em);}
	.cp-campaign .inbox .grid-box .middle .block:nth-child(2) {font-size: clamp(5.0em, 1vw, 5.6em);}
	.cp-campaign .inbox .grid-box .middle .big-price .point { font-size:clamp(1.0em, 1vw, 1.3em); }
	.cp-campaign .surprise-point h2 .sockets .caps-block {font-size: clamp(1.7em, 1vw, 1.0em);}
	.cp-campaign .surprise-point .big-surprise .base .keyword  { font-size: clamp(2.3em, 1vw, 2.6em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .left { font-size: clamp(6.5em, 1vw,8em); }
	.cp-campaign .surprise-point .big-surprise .accent-key { font-size: clamp(3.0em, 1vw, 3.4em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .right .block .caution { font-size: clamp(1.9em, 1vw, 2.3em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .right .block .parcent { font-size: clamp(5.8em, 1vw, 6.4em); }
	.cp-campaign .surprise-point-note { font-size: clamp(1.6em, 1vw, 1.8em);}
	.worries h2 { font-size: clamp(3.0em, 1vw, 3.6em); }
	.worries ul li {  font-size: clamp(1.7em, 1vw, 2.1em); letter-spacing:0em; line-height: 1em; }
    .worries ul li.worries01 { margin-top: -1.2rem; }
    .worries ul li.worries01 .sock { padding: 1.8rem 9rem 3rem 0; }
    .worries ul li.worries02 { margin-top: -3.6rem; }
    .worries ul li.worries02 .sock { padding: 1.8rem 0  3rem 9rem; }
    .worries ul li.worries03 { margin-top: -4.0rem; } 
    .worries ul li.worries03 .sock { padding: 1.8rem 9rem  3rem 0; } 
    .worries ul li.worries04 { margin-top: -2.6rem; }
    .worries ul li.worries04 .sock { padding: 1.8rem 0  3rem 9rem; }
    .case h2 { font-size: clamp(1.9em, 1vw, 2.3em); }
    .case dl.case-detail dt .caption-title { font-size: clamp(2.4em, 1vw, 2.9em); }
    .case dl.case-detail dd .case-detail-block .ok, 
    .case dl.case-detail dd .case-detail-block .ng { font-size: clamp(1.9em, 1vw, 2.2em); }
    .case dl.case-detail dd .case-detail-block .but{ font-size: clamp(1.2em, 1vw, 1.4em); }
	.corp-message .sub,
    .cp-product-effects h2 { font-size: clamp(2.4em, 1vw, 2.9em); }
	.cp-product-effects ul.merit { font-size: clamp(2.0em, 1vw, 2.4em); }
	.cp-product-effects .strong-message { font-size: clamp(2.4em, 1vw, 2.9em); }
	.corp-message .large,
	.event-info div.read{ font-size: clamp(1.6em, 1vw, 1.9em); }, { font-size: clamp(1.6em, 1vw, 2.0em); }
	.event-info h2,
	.form-info h2  { font-size: clamp(2.4em, 1vw, 2.9em); }
    .logo-bar { font-size: clamp(2.8rem, 1vw, 3.6rem); }
	.cta ul li.with-memo span.memo { font-size: clamp(1.1rem, 1vw, 1.2rem); }
    #Wapper,
    html body,
	footer { max-width:600px !important; width:auto;  width:auto; margin-left:auto; margin-right:auto; }
	picture.wide, picture.wide source, picture.wide img  { width: 100%; }
}





@media screen and (max-width: 540px) {

	html body  { max-width: 100%; font-size:13px; font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; }
	html body #Wapper { max-width: 430px; margin-left:auto; amrgin-right:auto; }
	.ph,
	.corp-message,
	.corp-image,
	.cta,
	.points,
	.worries,
	.case,
	.cp-product-effects,
	.event-info,
	.form-info,
	#contactform,
	.logo-bar,
	.footer{
	  max-width: 430px;
	  width:auto;
	  margin-left:0;
	  margin-right:0;
	  padding-left:0;
	  padding-right:0;
	}
	
    .mv .keyword .block { font-size: 2.1rem; } 
    .cp-catch  { max-width:100%; }
    .cp-catch .inbox  { width: 90%; padding-left;5%; padding-right;5%;  }
    .cp-catch .inbox .grid-box .middle .block { font-size: 1.4em; }
    .cp-head .inbox .grid-box .middle .block { font-size: 1.8rem; } 
    .cp-products .inbox .caps-box { font-size: 1.3em; }
    .cp-products .caps-box .nega span { font-size: 1.3em; }
    .cp-products .inbox { padding-left:  2%; padding-right:  2%;}
	.cp-products .inbox { width: 86%; padding: 4.2em 5% 3em 5%; }
	.cp-products-sock::before  { height: 32px; width: 90px; }
	.cp-products::after { height: 32px; width: 90px; margin-bottom: -30px; }
	.cp-campaign .surprise-point h2 { widht:90%; margin-left: 5%; margin-right: 5%; }
    .cp-campaign .inbox .grid-box .middle .big-price .grid-box .left { font-size: clamp(8rem, 1vw, 10em); }
    .cp-campaign .inbox .grid-box .side { margin;top;2em; }
    .cp-campaign .inbox .middle .block.impact { font-size: clamp(3.1rem, 1vw, 3.7rem); }
    .cp-campaign .inbox .grid-box .middle .sales-keyword { padding-top:0em; }
    .cp-campaign .inbox .grid-box .middle .sales-keyword .block { font-size: clamp(3.4em, 1vw, 4.6em); }
    .cp-campaign .inbox .middle .block .small { ont-size: clamp(0.3rem, 1vw, 0.45em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .no-tax { font-size: clamp(1.2em, 1vw, 1.5em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .with-tax { font-size: clamp(1.0em, 1vw, 1.3em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .note {font-size: clamp(1.3em, 1vw, 1.8em);}
	.cp-campaign .inbox .grid-box .middle .block:nth-child(2) { font-size: clamp(3.4em, 1vw, 4.6em); }
	.cp-campaign .inbox .grid-box .middle .big-price .point { font-size:clamp(0.7em, 1vw, 1.0em); }
	.cp-campaign .surprise-point h2 .sockets .caps-block {font-size: clamp(1.2em, 1vw, 1.6em); display:inline-block; width:100%; }
	.cp-campaign .surprise-point .big-surprise .base .keyword  { font-size: clamp(2.0em, 1vw, 2.3em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .left { font-size: clamp(4.5em, 1vw, 6.5em); }
	.cp-campaign .surprise-point .big-surprise .accent-key { font-size: clamp(2.4em, 1vw, 3.0em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .right .block .caution { font-size: clamp(1.2em, 1vw, 1.9em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .right .block .parcent { font-size: clamp(4.4em, 1vw, 5.8em); }
	.cp-campaign .surprise-point-note { font-size: clamp(1.2em, 1vw, 1.6em);}
	.worries h2 { font-size: clamp(2.4em, 1vw, 3.0em); }
	.worries ul li { font-size: clamp(1.3em, 1vw, 1.7em); letter-spacing: -0.1em; line-height: 1em; }
    .worries ul li.worries01 { margin-top: -1.2rem; }
    .worries ul li.worries01 .sock {     padding: 1.5rem 8rem 0 0; }
    .worries ul li.worries02 { margin-top: -1.5rem; }
    .worries ul li.worries02 .sock {     padding: 1.5rem 0 0 8rem; }
    .worries ul li.worries03 { margin-top: -1.9rem; } 
    .worries ul li.worries03 .sock {     padding: 1.5rem 8rem 0 0;} 
    .worries ul li.worries04 { margin-top: -1.4rem; }
    .worries ul li.worries04 .sock {     padding: 1.5rem 0 0 8rem; }
    .case h2 { font-size: clamp(1.6em, 1vw, 1.9em); }
    .case ul.case-list { padding: 0 5%; }
    .case dl.case-detail { padding: 20px 0; }
    .case dl.case-detail dt .caption-keyword {font-size: 1em; width: 90%; padding: 0 5%; }
    .case dl.case-detail dt .caption-title { font-size: 1.6em; width: 90%; padding: 0 5% 5% 5%; line-heigth:1.1em; height:2em;}
    .case dl.case-detail dd { width: 90%; padding: 0; margin: 0 5%; }
    .case dl.case-detail dd .case-detail-block { padding: 1.5rem 0 0 0; }
    .case dl.case-detail dd .case-detail-block .ok, 
    .case dl.case-detail dd .case-detail-block .ng { font-size: 1.4em; }
    .case dl.case-detail dd .case-detail-block .but{ font-size: 1.2em; }
	.case dl.case-detail { width:100%; padding-left: 0%; padding-right: 0%;  }
	.corp-message .sub,
    .cp-product-effects h2 { font-size: clamp(2.0em, 1vw, 2.4em); }
	.cp-product-effects ul.merit { font-size: clamp(1.6em, 1vw, 2.0em); }
	.cp-product-effects .strong-message { font-size: clamp(2.0em, 1vw, 2.4em); }
	.cp-product-effects .strong-message2 { font-size: clamp(2.0em, 1vw, 2.4em); }
	.event-info div.read{ font-size: clamp(1.3em, 1vw, 1.6em); }
	.corp-message .large,
	.event-info h2,
	.form-info h2 { font-size: clamp(2.0em, 1vw, 2.4em); }
	.logo-bar { font-size: clamp(2.4rem, 1vw, 3.3rem); }
	.cta ul.points { width: 90%; padding: 0 5%; }
	.cta ul li.with-memo span.memo { font-size: clamp(0.8rem, 1vw, 1.1rem); }
	.form-info .form-items { display: block; width:80%; margin: 0; padding: 0 10% 3em 10%; }
	.form-info .form-items li { display: block;  padding-left: 0; margin: 0; padding-right: 0; }
	.form-info .form-items input,
	.form-info .form-items textarea,
	.form-info .form-items select { font-size: 0.9em !important; padding: 0.3m !important; max-width:90% !important; }
    html body,
	footer { max-width:600px !important; width:auto; width:auto; margin-left:auto; margin-right:auto; }
	picture.wide, picture.wide source, picture.wide img  { width: 100%; }

}
@media screen and (max-width: 429px) {

	html body  { width: 100%; font-size:12pt; font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; }
	html body #Wapper { width: 370px;  margin-left:auto; amrgin-right:auto; }

	.ph,
	.corp-message,
	.corp-image,
	.cta,
	.points,
	.worries,
	.case,
	.cp-product-effects,
	.event-info,
	.form-info,
	#contactform,
	.logo-bar,
	footer{
	  max-width: 370px;
	  width:auto;
	  margin-left:0;
	  margin-right:0;
	  padding-left:0;
	  padding-right:0;
	}
	
    .mv .keyword .block { font-size: 2.0rem; } 
    .cp-catch  { max-width:100%; }
    .cp-catch .inbox  { width: 90%; padding-left;5%; padding-right;5%;  }
    .cp-catch .inbox .grid-box .middle .block { font-size: 1.4em; }
    .cp-head .inbox .grid-box .middle .block { font-size: 1.8rem; } 
    .cp-products .inbox .caps-box { font-size: 1.3em; }
    .cp-products .caps-box .nega span { font-size: 1.3em; }
    .cp-products .inbox { padding-left:  2%; padding-right:  2%;}
	.cp-products .inbox { width: 86%; padding: 4.2em 5% 3em 5%; }
	.cp-products-sock::before  { height: 32px; width: 90px; }
	.cp-products::after { height: 32px; width: 90px; margin-bottom: -30px; }
	.cp-campaign .surprise-point h2 { widht:90%; margin-left: 5%; margin-right: 5%; }
    .cp-campaign .inbox .grid-box .middle .big-price .grid-box .left { font-size: clamp(7rem, 1vw, 8em); }
    .cp-campaign .inbox .grid-box .side { margin;top;2em; }
    .cp-campaign .inbox .middle .block.impact { font-size: clamp(3.1rem, 1vw, 3.7rem); }
    .cp-campaign .inbox .grid-box .middle .sales-keyword { padding-top:0em; }
    .cp-campaign .inbox .grid-box .middle .sales-keyword .block { font-size: clamp(3.4em, 1vw, 4.6em); }
    .cp-campaign .inbox .middle .block .small { ont-size: clamp(0.3rem, 1vw, 0.45em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .no-tax { font-size: clamp(1.2em, 1vw, 1.5em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .with-tax { font-size: clamp(1.0em, 1vw, 1.3em); }
	.cp-campaign .inbox .grid-box .middle .big-price .grid-box .right .block .note {font-size: clamp(1.3em, 1vw, 1.8em);}
	.cp-campaign .inbox .grid-box .middle .block:nth-child(2) { font-size: clamp(3.4em, 1vw, 4.6em); }
	.cp-campaign .inbox .grid-box .middle .big-price .point { font-size:clamp(0.7em, 1vw, 1.0em); }
	.cp-campaign .surprise-point h2 .sockets .caps-block {font-size: clamp(1.1em, 1vw, 1.2em); display:inline-block; width:100%; }
	.cp-campaign .surprise-point .big-surprise .base .keyword  { font-size: clamp(2.0em, 1vw, 2.3em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .left { font-size: clamp(4.5em, 1vw, 6.5em); }
	.cp-campaign .surprise-point .big-surprise .accent-key { font-size: clamp(2.6em, 1vw, 3.0em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .right .block .caution { font-size: clamp(1.2em, 1vw, 1.9em); }
	.cp-campaign .surprise-point .big-surprise .base .grid-box .right .block .parcent { font-size: clamp(4.6em, 1vw, 5.8em); }
	.cp-campaign .surprise-point-note { font-size: clamp(1.2em, 1vw, 1.6em);}
	.worries h2 { font-size: clamp(2.4em, 1vw, 3.0em); }
	.worries ul li { font-size: clamp(1.3em, 1vw, 1.7em); letter-spacing: -0.1em; line-height: 1em; }
    .worries ul li.worries01 { margin-top: -1.2rem; }
    .worries ul li.worries01 .sock {     padding: 1.5rem 8rem 0 0; }
    .worries ul li.worries02 { margin-top: -1.5rem; }
    .worries ul li.worries02 .sock {     padding: 1.5rem 0 0 8rem; }
    .worries ul li.worries03 { margin-top: -1.9rem; } 
    .worries ul li.worries03 .sock {     padding: 1.5rem 8rem 0 0;} 
    .worries ul li.worries04 { margin-top: -1.4rem; }
    .worries ul li.worries04 .sock {     padding: 1.5rem 0 0 8rem; }
    .case h2 { font-size: clamp(1.5em, 1vw, 1.6em); }
    .case ul.case-list { padding: 0 5%; }
    .case dl.case-detail { padding: 20px 0; }
    .case dl.case-detail dt .caption-keyword {font-size: 1em; width: 90%; padding: 0 5%; }
    .case dl.case-detail dt .caption-title { font-size: 1.6em; width: 90%; padding: 0 5% 5% 5%; line-heigth:1.1em; height:2em; }
    .case dl.case-detail dd { width: 90%; padding: 0; margin: 0 5%; }
    .case dl.case-detail dd .case-detail-block { padding: 1.5rem 0 0 0; }
    .case dl.case-detail dd .case-detail-block .ok, 
    .case dl.case-detail dd .case-detail-block .ng { font-size: 1.4em; }
    .case dl.case-detail dd .case-detail-block .but{ font-size: 1.2em; }
	.case dl.case-detail { width:100%; padding-left: 0%; padding-right: 0%;  }
	.corp-message .sub,
    .cp-product-effects h2 { font-size: clamp(2.0em, 1vw, 2.4em); }
	.cp-product-effects ul.merit { font-size: clamp(1.6em, 1vw, 2.0em); }
	.cp-product-effects .strong-message { font-size: clamp(2.0em, 1vw, 2.4em); }
	.cp-product-effects .strong-message2 { font-size: clamp(2.0em, 1vw, 2.4em); }
	.event-info div.read{ font-size: clamp(1.1em, 1vw, 1.6em); }
	.corp-message .large,
	.event-info h2,
	.form-info h2 { font-size: clamp(2.0em, 1vw, 2.4em); }
	.logo-bar { font-size: clamp(2.4rem, 1vw, 3.3rem); }
	.cta ul.points { width: 90%; padding: 0 5%; }
	.cta ul li.with-memo span.memo { font-size: clamp(0.8rem, 1vw, 1.1rem); }
	.form-info .form-items { display: block; width:90%; margin: 0; padding: 0 5% 3em 5%; }
	.form-info .form-items li { display: block;  padding-left: 0; margin: 0; padding-right: 0; }
	.form-info .form-items input,
	.form-info .form-items textarea,
	.form-info .form-items select { font-size: 0.8em; padding: 0.8em; max-width:calc( 100% - 16 );; }
    html body,
	footer { max-width:370px !important; width:auto; margin-left:auto; margin-right:auto; }
	footer .co-detail { font-size: 1.5em; }
	footer .copyright { font-size: 1.2em; }
	picture.wide, picture.wide source, picture.wide img  { width: 100%; }

}