@charset "utf-8";
/* CSS Document */

/* ====================
 reset
==================== */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, var, b, i, dl dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
body { line-height: 1; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; }
a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
ins { background-color: #ff9; color: #000; text-decoration: none; }
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
table { border-collapse: collapse; border-spacing: 0; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
input, select { vertical-align: middle; }
img { vertical-align: top; font-size: 0; line-height: 0; }
sup { font-size: 8px; }
em { font-style: normal; }
div:before, div:after, ul:before, ul:after, ol:before, ol:after, dl:before, dl:after { content: ""; display: block; }
div:after, ul:after, ol:after, dl:after { clear: both; }
div, ul, ol, dl { zoom: 1; }


/* ====================
 common
==================== */
html {
height: 100%;
}

body {
font-family: 'Noto Sans JP', sans-serif;
font-size: 18px;
font-weight: 400;
line-height: 1.7;
color: #231815;
width: 100%;
height: 100%;
background: #ffebf0;
}
@media screen and (max-width: 500px) {
body {
font-size: calc(100vw / 500 * 18);
background-image: none;
background: #ffffff;
}
}

body::before{
content: "";
display: block;
width: 100%;
height: 100vh;
position: fixed;
top: 0;
left: 0;
z-index: -10;
background-image: url(../img/pc_bg.webp);
background-repeat: no-repeat;
background-size: 60% auto;
background-position : 0% 50%;
}
@media (min-width: 500px) and (max-width: 1000px) {
body::before{
background-size: 100% auto;
background-position : calc(100vw / 1000 * -350) 50%;
}
}

a{
color: #231815;
text-decoration: none;
}
a:hover {
color: #231815;
text-decoration: none;
}

main{
position: relative;
}

main,
main img{
width: 100%;
}

main h1,
main h2,
main h3,
main h4,
main h5,
main h6
main p{
font-weight: normal;
}

/* gotop btn */
main .gotop_pc {
width: 80px;
position: fixed;
right: 50px;
bottom: 100px;
/*bottom: 225px;*/
z-index: 99;
display: block;
}
@media (min-width: 1000px) and (max-width: 1400px) {
main .gotop_pc {
width: 80px;
right: calc(100vw / 1400 * 35);
bottom: calc(100vw / 1400 * 100);
/*bottom: calc(100vw / 1400 * 225);*/
}
}
@media (min-width: 500px) and (max-width: 1000px) {
main .gotop_pc {
width: 75px;
right: calc(100vw / 1000 * 35);
bottom: 100px;
}
}
@media screen and (max-width: 500px) {
main .gotop_pc {
display: none;
}
}

main .gotop_sp {
display: none;
}
@media screen and (max-width: 500px) {
main .gotop_sp {
width: 16%;
position: fixed;
right: calc(100vw / 500 * 25);
z-index: 99;
bottom: 0;
}
}
/* end / gotop btn */

/*	floating btn */
.ft_enq_pc{
width: 215px;
position: fixed;
right: -1px;
bottom: 35px;
z-index: 98;
display: block;
}
@media (min-width: 1000px) and (max-width: 1400px) {
.ft_enq_pc{
width: calc(100vw / 1400 * 200);
bottom: 35px;
}
}
@media (min-width: 500px) and (max-width: 1000px) {
.ft_enq_pc{
display: none;
}
}
@media screen and (max-width: 500px) {
.ft_enq_pc{
display: none;
}
}

.ft_enq_sp{
display: none;
}
@media (min-width: 500px) and (max-width: 1000px) {
.ft_enq_sp{
position: fixed;
bottom: 0;
left: 0;
right: 0;
margin: auto;
display: block;
padding:  15px 50px;
width: 500px;
background-color: #d38aad;
box-sizing: border-box;
z-index: 98;
}
}
@media screen and (max-width: 500px) {
.ft_enq_sp{
position: fixed;
bottom: 0;
left: 0;
display: block;
padding:  calc(100vw / 500 * 15) calc(100vw / 500 * 50);
width: 100%;
background-color: #d38aad;
box-sizing: border-box;
z-index: 98;
}
}
/* end / floating btn */

.conts_wrap {
background: #ffffff;
max-width: 500px;
margin: 0 16% 0 auto;
position: relative;
z-index: 10;
}
@media (min-width: 500px) and (max-width: 1000px) {
.conts_wrap {
margin: 0 auto;
}
}
@media screen and (max-width: 500px) {
.conts_wrap {
max-width: 100%;
margin: 0 auto;
}
}

.attention{
font-size: 80% !important;
}

/*	clearFix */
.cf:after{
content:"."; 
display:block; 
height:0; 
clear:both; 
visibility:hidden;
}
/* Hides from IE-mac \*/
* html .cf{height:1%;}
.cf{display:block;}
/**/


/* ====================
 fade animation
==================== */
.fade {
opacity: 0;
transform: translateY(30px);
transition: opacity 0.75s, transform 0.75s;
}
.fade.active {
opacity: 1;
transform: translateY(0px);
}


/* ====================
 menu_pc
==================== */
.menu_pc{
width: 100%;
height: 100%;
position: fixed;
z-index: 1;
}
@media (min-width: 500px) and (max-width: 1000px) {
.menu_pc{
display: none !important;
}
}
@media screen and (max-width: 500px) {
.menu_pc{
display: none !important;
}
}

.menu_pc h1{
max-width: 177px;
position: absolute;
top: 7.5vh;
left: 4.5vw;
}

.menu_pc h2{
max-width: 14px;
position: absolute;
left: 1.75vw;
top: 50%;
transform: translateY(-50%);
}

.menu_pc ul{
position: absolute;
top: 18vh;
left: 4.5vw;
}

.menu_pc ul li{ max-width: 160px;}
.menu_pc ul li:nth-of-type(1){ margin: 0 0 2.5vh;}

.menu_pc .instagram{
max-width: 185px;
position: absolute;
bottom: 4.5vh;
left: 4.5vw;
}


/* ====================
 sec_head
==================== */
.sec_head{
display: none;
}
@media screen and (max-width: 500px) {
.sec_head{
display: block;
width: 100%;
margin: 0 auto;
text-align: center;
background: #ffffff;
}

.sec_head h2{
width: 44%;
padding: calc(100vw / 500 * 30) 0 calc(100vw / 500 * 25);
margin: 0 auto;
text-align: center;
}
}


/* ====================
 sec_kv
==================== */
.sec_kv{
width: 100%;
margin: 0 auto;
text-align: center;
position: relative;
background: #fbf4f5;
}

.sec_kv .kv_bg1{
width: 100%;
height: 515px;
background: url(../img/kv_bg1.jpg) no-repeat top center;
background-size: 100% auto;
}
@media screen and (max-width: 500px) {
.sec_kv .kv_bg1{
height: calc(100vw / 500 * 500);
}
}

.sec_kv .kv_txt1{
width: 83%;
margin: 0 auto;
padding: 230px 0 0;
opacity: 0;
animation: kv_fade 1s 1s ease-in-out forwards;
}
@media screen and (max-width: 500px) {
.sec_kv .kv_txt1{
padding: calc(100vw / 500 * 220) 0 0;
}
}

.sec_kv .kv_bg2{
width: 100%;
height: 515px;
background: url(../img/kv_bg2.jpg) no-repeat top center;
background-size: 100% auto;
position: absolute;
top: 0;
z-index: 11;
opacity: 0;
animation: kv_fade 1.25s 3.5s ease-in-out forwards;
}
@media screen and (max-width: 500px) {
.sec_kv .kv_bg2{
height: calc(100vw / 500 * 500);
}
}

.sec_kv .kv_txt2{
width: 22%;
position: absolute;
bottom: 40px;
right: 35px;
z-index: 12;
opacity: 0;
animation: kv_fade 0.5s 5s ease-in-out forwards;
}
@media screen and (max-width: 500px) {
.sec_kv .kv_txt2{
bottom: calc(100vw / 500 * 40);
right: calc(100vw / 500 * 35);
}
}

@keyframes kv_fade {
0% {opacity: 0;}
100% {opacity: 1;}
}


/* ====================
 sec_concept
==================== */
.sec_concept{
width: 100%;
padding: 45px 0 35px;
background: #fbf4f5;
}
@media screen and (max-width: 500px) {
.sec_concept{
padding: calc(100vw / 500 * 45) 0 calc(100vw / 500 * 35);
}
}

.sec_concept .inner{
width: 90%;
margin: 0 auto;
text-align: center;
}

.sec_concept h2{
font-size: 115%;
font-weight: 400;
padding: 0;
margin: 0 auto 40px;
}
@media screen and (max-width: 500px) {
.sec_concept h2{
margin: 0 auto calc(100vw / 500 * 40);
}
}

.sec_concept h2 span{
font-size: 160%;
font-weight: 500;
color: #d38aad;
}

.sec_concept .u_line{
line-height: 2.1;
text-decoration: underline;
text-decoration-color: #d38aad;
text-decoration-thickness: 2px; /* 線の太さ */
text-underline-offset: 7px;
}
@media screen and (max-width: 500px) {
.sec_concept .u_line{
text-decoration-thickness: calc(100vw / 500 * 2); /* 線の太さ */
text-underline-offset: calc(100vw / 500 * 7);
}
}

.sec_concept .attention{
text-align: right;
margin: 15px 40px 0 0;
}
@media screen and (max-width: 500px) {
.sec_concept .attention{
margin: calc(100vw / 500 * 15) calc(100vw / 500 * 40) 0 0;
}
}


/* ====================
 sec_prd
==================== */
.sec_prd{
width: 100%;
padding: 70px 0 0;
}
@media screen and (max-width: 500px) {
.sec_prd{
width: 100%;
padding: calc(100vw / 500 * 70) 0 0;
}
}

.sec_prd h2{
width: 36%;
margin: 0 auto;
text-align: left;
display: inline-block;
}

.sec_prd .inner{
width: 90%;
margin: 0 auto;
text-align: center;
position: relative;
}

.sec_prd .items{
width: 100%;
}

.sec_prd .items li{
text-align: left;
margin: 0;
padding: 30px 0 0;
}
@media screen and (max-width: 500px) {
.sec_prd .items li{
padding: calc(100vw / 500 * 30) 0 0;
}
}

.sec_prd .items li span{
width: 50%;
margin: 0;
padding: 0.5em 0 0 0.15em;
display: inline-block;
}

.sec_prd .line_left {
  display: flex;
  align-items: flex-start; /* 垂直中心 */
}

.sec_prd .line_left:before {
  border-top: #d289ac 1px solid;
  content: "";
  width: 3em; /* 線の長さ */
  margin-top: 1em; /* 文字の右隣 */
  margin-right: 1em; /* 文字の右隣 */
}

.sec_prd .inner .ab1{
width: 16%;
position: absolute;
top: 40px;
right: 45px;
}
@media screen and (max-width: 500px) {
.sec_prd .inner .ab1{
top: calc(100vw / 500 * 40);
right: calc(100vw / 500 * 45);
}
}

.sec_prd .inner .ab2{
width: 16%;
position: absolute;
bottom: 8px;
right: 45px;
}
@media screen and (max-width: 500px) {
.sec_prd .inner .ab2{
bottom: calc(100vw / 500 * 8);
right: calc(100vw / 500 * 45);
}
}

/* --------------------
 prd_item1 + 2
-------------------- */
.prd_item1,
.prd_item2{
margin: 0 auto;
text-align: center;
}
.prd_item1{ background: #ffffff; padding: 60px 0 30px;}
.prd_item2{ background: #fbf4f5; padding: 60px 0 30px;}
@media screen and (max-width: 500px) {
.prd_item1{ background: #ffffff; padding: calc(100vw / 500 * 60) 0 calc(100vw / 500 * 30);}
.prd_item2{ background: #fbf4f5; padding: calc(100vw / 500 * 60) 0 calc(100vw / 500 * 30);}
}

.prd_item1 h3,
.prd_item2 h3{
width: 96%;
margin: 0 auto;
padding: 0 0 20px;
}
@media screen and (max-width: 500px) {
.prd_item1 h3,
.prd_item2 h3{
padding: 0 0 calc(100vw / 500 * 20);
}
}

.prd_item1 h4,
.prd_item2 h4{
font-size: 105%;
padding: 0 0 20px;
}
@media screen and (max-width: 500px) {
.prd_item1 h4,
.prd_item2 h4{
padding: 0 0 calc(100vw / 500 * 20);
}
}

.prd_item1 h5,
.prd_item2 h5{
font-size: 88%;
padding: 0 0 16px;
}
@media screen and (max-width: 500px) {
.prd_item1 h5,
.prd_item2 h5{
padding: 0 0 calc(100vw / 500 * 16);
}
}

.prd_item1 .pkg,
.prd_item2 .pkg{
width: 70%;
margin: 0 auto 40px;
text-align: center;
}
@media screen and (max-width: 500px) {
.prd_item1 .pkg,
.prd_item2 .pkg{
margin: 0 auto calc(100vw / 500 * 40);
}
}

.prd_item1 .item_lead,
.prd_item2 .item_lead{
font-size: 115%;
font-weight: 400;
padding: 0;
margin: 0 auto 70px;
text-align: left;
display: inline-block;
}
@media screen and (max-width: 500px) {
.prd_item1 .item_lead,
.prd_item2 .item_lead{
margin: 0 auto calc(100vw / 500 * 70);
}
}

.prd_item1 .item_lead span:nth-of-type(1),
.prd_item2 .item_lead span:nth-of-type(1){
text-decoration: underline;
text-decoration-color: #d38aad;
text-decoration-thickness: 2px; /* 線の太さ */
text-underline-offset: 10px;
}
@media screen and (max-width: 500px) {
.prd_item1 .item_lead span:nth-of-type(1),
.prd_item2 .item_lead span:nth-of-type(1){
text-decoration-thickness: calc(100vw / 500 * 2); /* 線の太さ */
text-underline-offset: calc(100vw / 500 * 10);
}
}

.prd_item1 .item_lead span:nth-of-type(2),
.prd_item2 .item_lead span:nth-of-type(2){
font-size: 160%;
font-weight: 500;
color: #d38aad;
}

.prd_item1 .point,
.prd_item2 .point{
max-width: 96%;
margin: 0 auto 0;
text-align: center;
}

.prd_item1 .point li,
.prd_item2 .point li{
border-radius: 50px;
padding: 20px 25px;
margin: 0 0 40px;
text-align: left;
position: relative;
}
@media screen and (max-width: 500px) {
.prd_item1 .point li,
.prd_item2 .point li{
border-radius: calc(100vw / 500 * 50);
padding: calc(100vw / 500 * 20) calc(100vw / 500 * 25);
margin: 0 0 calc(100vw / 500 * 40);
}
}

.prd_item1 .point li{ background: #f8e9ef;}
.prd_item2 .point li{ background: #f2e0e9;}

.prd_item1 .point li:last-child,
.prd_item2 .point li:last-child{
margin: 0 0 50px;
}
@media screen and (max-width: 500px) {
.prd_item1 .point li:last-child,
.prd_item2 .point li:last-child{
margin: 0 0 calc(100vw / 500 * 50);
}
}

.prd_item1 .point li div,
.prd_item2 .point li div{
width: 16%;
position: absolute;
z-index: 21;
top: -22px;
left: 25px;
}
@media screen and (max-width: 500px) {
.prd_item1 .point li div,
.prd_item2 .point li div{
top: calc(100vw / 500 * -22);
left: calc(100vw / 500 * 25);
}
}

.prd_item1 dl,
.prd_item2 dl{
width: 94%;
text-align: center;
margin: 20px auto 35px;
display: flex;
align-items: center;
}
@media screen and (max-width: 500px) {
.prd_item1 dl,
.prd_item2 dl{
margin: calc(100vw / 500 * 20) auto calc(100vw / 500 * 35);
}
}

.prd_item1 dt,
.prd_item2 dt{
width: 45%;
text-align: left;
margin: 0;
}

.prd_item1 dd,
.prd_item2 dd{
width: 50%;
text-align: left;
margin: 0;
padding: 0 0 0 4%;
font-size: 94%;
font-weight: 400;
}

.prd_item1 .txt_area1,
.prd_item2 .txt_area1{
width: 94%;
margin: 0 auto 10px;
text-align: center;
border-left:#d38aad 1px solid;
}
@media screen and (max-width: 500px) {
.prd_item1 .txt_area1,
.prd_item2 .txt_area1{
margin: 0 auto calc(100vw / 500 * 10);
}
}

.prd_item1 .txt_area1 p,
.prd_item2 .txt_area1 p{
text-align: left;
padding: 0 0 0 10px;
}
@media screen and (max-width: 500px) {
.prd_item1 .txt_area1 p,
.prd_item2 .txt_area1 p{
padding: 0 0 0 calc(100vw / 500 * 10);
}
}

.prd_item1 .txt_area2,
.prd_item2 .txt_area2{
width: 80%;
text-align: center;
padding: 30px 15px 30px;
border-radius: 10px;
}
@media screen and (max-width: 500px) {
.prd_item1 .txt_area2,
.prd_item2 .txt_area2{
padding: calc(100vw / 500 * 30) calc(100vw / 500 * 15) calc(100vw / 500 * 30);
border-radius: calc(100vw / 500 * 10);
}
}

.prd_item1 .txt_area2{ background: #f8e9ef; margin: 0 auto 70px;}
.prd_item2 .txt_area2{ background: #f2e0e9; margin: 0 auto 50px;}
@media screen and (max-width: 500px) {
.prd_item1 .txt_area2{ background: #f8e9ef; margin: 0 auto calc(100vw / 500 * 70);}
.prd_item2 .txt_area2{ background: #f2e0e9; margin: 0 auto calc(100vw / 500 * 50);}
}

.prd_item1 .txt_area2 h4,
.prd_item2 .txt_area2 h4{
font-weight: 400;
padding: 10px;
margin: 0;
display: inline-block;
border-bottom: #d289ac 2px solid;
border-top: #d289ac 2px solid;
}
@media screen and (max-width: 500px) {
.prd_item1 .txt_area2 h4,
.prd_item2 .txt_area2 h4{
padding: calc(100vw / 500 * 10);
}
}

.prd_item1 .txt_area2 p,
.prd_item2 .txt_area2 p{
text-align: left;
padding: 0;
margin: 25px 0 20px;
}
@media screen and (max-width: 500px) {
.prd_item1 .txt_area2 p,
.prd_item2 .txt_area2 p{
margin: calc(100vw / 500 * 25) 0 calc(100vw / 500 * 20);
}
}

.prd_item1 .txt_area2 div,
.prd_item2 .txt_area2 div{
margin: 0 auto;
text-align: center;
}
.prd_item1 .txt_area2 div{ width: 92%;}
.prd_item2 .txt_area2 div{ width: 100%;}

.prd_item2 .txt_area3{
width: 81%;
margin: 0 auto 30px;
text-align: center;
padding: 25px 10px 30px;
border: #d38aad 2px solid;
border-radius: 10px;
}
@media screen and (max-width: 500px) {
.prd_item2 .txt_area3{
margin: 0 auto calc(100vw / 500 * 30);
padding: calc(100vw / 500 * 25) calc(100vw / 500 * 10) calc(100vw / 500 * 30);
border-radius: calc(100vw / 500 * 10);
}
}

.prd_item2 .txt_area3 h4{
font-size: 115%;
font-weight: 400;
padding: 0;
margin: 0 auto ;
text-align: left;
display: inline-block;
}

.prd_item2 .txt_area3 h4 span{
font-size: 160%;
font-weight: 500;
color: #d38aad;
}

.prd_item2 .txt_area3 ul{
width: 100%;
margin: 20px auto 0;
display: flex;
justify-content: space-between;
}
@media screen and (max-width: 500px) {
.prd_item2 .txt_area3 ul{
margin: calc(100vw / 500 * 20) auto 0;
}
}

.prd_item2 .txt_area3 li{
width: 30%;
margin: 0 auto;
}

.prd_item2 .txt_area3 li p{
font-size: 94%;
line-height: 1.5;
}

.prd_item2 .txt_area3 li div + p{
font-size: 84%;
line-height: 1.35;
}

.prd_item2 .txt_area3 li div{
width: 90%;
margin: 10px auto;
text-align: center;
}
@media screen and (max-width: 500px) {
.prd_item2 .txt_area3 li div{
margin: calc(100vw / 500 * 10) auto;
}
}

.prd_item1 .attention,
.prd_item2 .attention{
text-align: right;
}
.prd_item2 .attention{padding-right: 7%;}
.prd_item2 .attention.last{ margin-bottom: 70px;}

.prd_item2 .txt_area4{
width: 94%;
text-align: center;
margin: 0 auto;
background: #ffffff;
}

.prd_item2 .txt_area4 ul{
padding: 30px 25px;
display: flex;
justify-content: space-between;
}
@media screen and (max-width: 500px) {
.prd_item2 .txt_area4 ul{
padding: calc(100vw / 500 * 30) calc(100vw / 500 * 25);
}
}

.prd_item2 .txt_area4 li:nth-child(1){
width: 16%;
}

.prd_item2 .txt_area4 li:nth-child(2){
width: 76%;
margin: 0 0 0 7%;
}

.prd_item2 .txt_area4 li h4{
text-align: left;
font-size: 115%;
font-weight: 500;
color: #d38aad;
margin: 15px 0 10px;
padding: 0;
}
@media screen and (max-width: 500px) {
.prd_item2 .txt_area4 li h4{
margin: calc(100vw / 500 * 15) 0 calc(100vw / 500 * 10);
}
}

.prd_item2 .txt_area4 li p{
text-align: left;
font-size: 105%;
}


/* --------------------
 accordion
-------------------- */
.accordion{
margin: 0 auto 40px;
}
@media screen and (max-width: 500px) {
.accordion{
margin: 0 auto calc(100vw / 500 * 40);
}
}

.accordion-check{
display: none;
}

.accordion-label{
border: #d38aad 2px solid;
background: #ffffff;
display: block;
padding: 15px 0 10px 35px;
position: relative;
cursor: pointer;
}
@media screen and (max-width: 500px) {
.accordion-label{
border: #d38aad 2px solid;
padding: calc(100vw / 500 * 18) 0 calc(100vw / 500 * 10) calc(100vw / 500 * 35);
}
}

.accordion-label img{
width: 76%;
text-align: left;
margin: 0;
display: block;
}

.accordion-label:after{
color: #fff;
background: #d38aad;
box-sizing: border-box;
content: '＋';
display: block;
font-size: 170%;
font-weight: 200;
line-height: 0.65;
height: auto;
padding: 12px 10px 17px;
position: absolute;
right: 12px;
top: 12px;
}
@media screen and (max-width: 500px) {
.accordion-label:after{
padding: calc(100vw / 500 * 12) calc(100vw / 500 * 10) calc(100vw / 500 * 17);
right: calc(100vw / 500 * 12);
top: calc(100vw / 500 * 12);
}
}

.accordion-content{
display: block;
height: 0;
opacity: 0;
padding: 0;
transition: .1s;
visibility: hidden;
}
.accordion-check:checked + .accordion-label:after{
content: '－';
}
.accordion-check:checked + .accordion-label + .accordion-content{
height: auto;
opacity: 1;
padding: 0;
visibility: visible;
}

.accordion-content .ac1,
.accordion-content .ac2,
.accordion-content .ac3{
margin: 0 auto;
padding: 0;
}

.accordion-content .ac1,
.accordion-content .ac2{background: #fbf4f5;}
.accordion-content .ac3{background: #ffffff;}

.ac1 .ac_inner,
.ac2 .ac_inner,
.ac3 .ac_inner{
padding: 50px 25px;
}
@media screen and (max-width: 500px) {
.ac1 .ac_inner,
.ac2 .ac_inner,
.ac3 .ac_inner{
padding: calc(100vw / 500 * 50) calc(100vw / 500 * 25);
}
}

/* ac1 */
.ac1 .ac_inner p{
font-size: 105%;
text-align: left;
}

.ac1 .ac_inner p.attention{
margin: 10px 0 0;
text-align: left;
}

.ac1 .ac_inner .ph{
width: 80%;
margin: -1em 0 0 60px;
}
@media screen and (max-width: 500px) {
.ac1 .ac_inner .ph{
margin: -1em 0 0 calc(100vw / 500 * 60);
}
}

/* ac2 */
.ac2 .ac_inner h4{
font-size: 105%;
text-align: left;
text-decoration: underline;
text-decoration-color: #d38aad;
text-decoration-thickness: 2px; /* 線の太さ */
text-underline-offset: 10px;
margin: 0;
padding: 0;
}
@media screen and (max-width: 500px) {
.ac2 .ac_inner h4{
text-decoration-thickness: calc(100vw / 500 * 2); /* 線の太さ */
text-underline-offset: calc(100vw / 500 * 10);
}
}

.ac2 .ac_inner h4 span{
font-size: 160%;
font-weight: 500;
color: #d38aad;
}

.ac2 .ac_inner p{
font-size: 105%;
text-align: left;
margin: 10px 0 25px;
}
@media screen and (max-width: 500px) {
.ac2 .ac_inner p{
margin: calc(100vw / 500 * 10) 0 calc(100vw / 500 * 25);
}
}

.ac2 .ac_inner p:last-child{margin: 10px 0 0;}
@media screen and (max-width: 500px) {
.ac2 .ac_inner p:last-child{margin: calc(100vw / 500 * 10) 0 0;}
}

/* ac3 */
.ac3 .ac_inner ul.step li{
width: 100%;
margin: 0 auto 40px;
padding: 0;
display: flex;
justify-content: space-between;
}
@media screen and (max-width: 500px) {
.ac3 .ac_inner ul.step li{
margin: 0 auto calc(100vw / 500 * 40);
}
}

.ac3 .ac_inner ul.step li div{
width: 32%;
text-align: left;
margin: 0 4% 0 0;
}

.ac3 .ac_inner ul.step li p{
width: 63%;
font-size: 105%;
line-height: 1.6;
text-align: left;
margin: 0 auto;
display: inline-block;
}

.ac3 .ac_inner ul.txt{
width: 100%;
font-size: 80% !important;
margin: 0 auto 10px;
padding: 0;
display: flex;
justify-content: center;
}
@media screen and (max-width: 500px) {
.ac3 .ac_inner ul.txt{
margin: 0 auto calc(100vw / 500 * 10);
}
}

.ac3 .ac_inner ul.txt li:nth-child(1){
width: 48%;
text-align: right;
}
.ac3 .ac_inner ul.txt li:nth-child(2){
width: 51.5%;
text-align: left;
}

.ac3 .ac_inner .ph{
width: 72%;
margin: 0 0 0 auto;
}

.ac3 .ac_inner h4{
width: 22%;
margin: 35px 0 0;
padding: 0;
}
@media screen and (max-width: 500px) {
.ac3 .ac_inner h4{
margin: calc(100vw / 500 * 35) 0 0;
}
}

.ac3 .ac_inner h5{
width: 52%;
margin: 40px 0 0;
padding: 0;
}
@media screen and (max-width: 500px) {
.ac3 .ac_inner h5{
margin: calc(100vw / 500 * 40) 0 0;
}
}

.ac3 .ac_inner p{
font-size: 105%;
text-align: left;
margin: 10px 0 0;
}
@media screen and (max-width: 500px) {
.ac3 .ac_inner p{
margin: calc(100vw / 500 * 10) 0 0;
}
}


/* ====================
 sec_spc
==================== */
.sec_spc{
width: 100%;
padding: 70px 0 90px;
}
@media screen and (max-width: 500px) {
.sec_spc{
padding: calc(100vw / 500 * 70) 0 0;
/*padding: calc(100vw / 500 * 70) 0 calc(100vw / 500 * 90);*/
}
}

.sec_spc h2{
width: 36%;
margin: 0 auto;
text-align: left;
display: inline-block;
}

.sec_spc .inner{
width: 90%;
margin: 0 auto;
text-align: center;
}

.sec_spc h3{
width: 24%;
margin: 40px auto 30px;
text-align: center;
}
@media screen and (max-width: 500px) {
.sec_spc h3{
margin: calc(100vw / 500 * 40) auto calc(100vw / 500 * 30);
}
}

.sec_spc .inner ul{
width: 100%;
margin: 30px auto 0;
display: flex;
justify-content: space-between;
}
@media screen and (max-width: 500px) {
.sec_spc .inner ul{
margin: calc(100vw / 500 * 30) auto 0;
}
}

.sec_spc .inner li{
width: 30%;
margin: 0 auto;
}


/* ====================
 sec_enq
==================== */
.sec_enq{
width: 100%;
padding: 40px 0 30px;
background: #d38aad;
}
@media screen and (max-width: 500px) {
.sec_enq{
padding: calc(100vw / 500 * 40) 0 calc(100vw / 500 * 30);
}
}

.sec_enq .inner{
width: 90%;
margin: 0 auto;
text-align: center;
}

.sec_enq h3{
width: 88%;
margin: 0 auto 20px;
text-align: center;
}
@media screen and (max-width: 500px) {
.sec_enq h3{
margin: 0 auto calc(100vw / 500 * 20);
}
}

.sec_enq ul{
margin: 20px auto;
}
@media screen and (max-width: 500px) {
.sec_enq ul{
margin: calc(100vw / 500 * 20) auto;
}
}

.sec_enq li{
font-size: 78%;
color: #ffffff;
text-align: left;
padding-left: 1em;
text-indent: -1em;
}

.sec_enq .btn_box{
width: 100%;
margin: 0;
}

.sec_enq .enq_btn{
font-size: 115%;
color: #231815;
margin: 0 auto;
text-align: center;
width: 100%;
padding: 10px 0;
/*height: 50px;*/
background: #ffffff;
position: relative;
display: block;
overflow: hidden;
transition: 0.5s;
text-decoration: none;
}
@media screen and (max-width: 500px) {
.sec_enq .enq_btn{
padding: calc(100vw / 500 * 10) 0;
}
}

.sec_enq .enq_btn:after {
font-family: "FontAwesome";
content: "\f105";
position: absolute;
right: 35px;
transition: all 0.2s;
}
@media screen and (max-width: 500px) {
.sec_enq .enq_btn:after {
right: calc(100vw / 500 * 35);
}
}

.sec_enq .enq_btn:hover:after {
right: 25px;
}
@media screen and (max-width: 500px) {
.sec_enq .enq_btn:hover:after {
right: calc(100vw / 500 * 25);
}
}


/* ====================
 footer
==================== */
footer{
width: 100%;
padding: 40px 0 0;
}
@media screen and (max-width: 500px) {
footer{
padding: calc(100vw / 500 * 170) 0 0;
}
}

footer .inner{
width: 90%;
margin: 0 auto;
text-align: center;
}

footer .instagram{
width: 76%;
margin: 0 auto 40px;
text-align: center;
}
@media screen and (max-width: 500px) {
footer .instagram{
margin: 0 auto calc(100vw / 500 * 40);
}
}

footer .logo_area{
padding: 40px 0;
border-top: #3c3c3c solid 2px;
}
@media screen and (max-width: 500px) {
footer .logo_area{
padding: calc(100vw / 500 * 40) 0;
}
}

footer .logo_area p{
font-size: 88%;
}

footer .logo_area .logo{
width: 38%;
margin: 20px auto;
text-align: center;
}
@media screen and (max-width: 500px) {
footer .logo_area .logo{
margin: calc(100vw / 500 * 20) auto;
}
}

footer .copyright{
background: #c8c8c8;
margin: 0 auto;
text-align: center;
}

footer .copyright p{
font-size: 66%;
padding: 15px 0;
}
@media screen and (max-width: 500px) {
footer .copyright p{
padding: calc(100vw / 500 * 15) 0;
}
}