@charset "UTF-8";
/********************************/
/* トップ　*/
/********************************/
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@800&family=Zen+Maru+Gothic:wght@700&display=swap');

img{width:100%; height:auto;}
::before, ::after {box-sizing: border-box;}
.clear{clear:both;}
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }

body {width:100%;font-family:"メイリオ","Yu Gothic","游ゴシック",sans-serif,"Hiragino Kaku Gothic Pro W6","ヒラギノ角ゴ Pro W6","Osaka","ＭＳ Ｐゴシック"; font-weight:500;background-attachment:fixed;background:#fff;padding:0;margin:0;vertical-align:top;height:100%;text-align:center;line-height:165%;-webkit-text-size-adjust: 100%;}

#container{max-width:750px; margin:0 auto; padding:0 0 20px;}

/*top画像*/
header{background:url(../img/mainback.png) no-repeat;background-position: center top;background-size: cover;position:relative; padding-top:80.6%;}

h1.logo{ max-width:77px;position:absolute; top:10px; left:10px;margin:0;padding:0;}
header .ca1{ width:90%;text-align:center;position:absolute; top:48%; left:5%;background:#fff; box-shadow: 6px 6px 1px #444;opacity:0.9;}
header .ca2{width:96%;text-align:center;position:absolute; bottom:15%; left:2%;background:#fff;box-shadow: 6px 6px 1px #444;opacity:0.9;}
header .ca1 p{font-family: 'Zen Maru Gothic', serif; font-size:2.2rem; font-weight:800; padding:5px 10px; color:#000;line-height:150%;}
header .ca2 p{font-family:'Zen Maru Gothic', serif; font-size:2.0rem;  font-weight:800;padding:10px;color:#000;line-height:150%;}
.f45b{color:#e52e5e; font-size:45px;font-weight:800;}
.f40b{color:#e52e5e;font-size:40px;font-weight:800;}
.f45{font-size:45px;font-weight:800;}
.f40{font-size:40px;font-weight:800;}
.f48{font-size:48px;font-weight:800;}
.backyl{background:#ffff00; padding:0 10px;}
.fyellow{color:#ffff00;}
header .wo1{position:absolute;top:45%;left:40%;}
.f56b{color:#e52e5e; font-size:3.2rem;font-weight:800;}
.f56kana{color:#e52e5e; font-size:3.5rem;font-weight:800; letter-spacing:-0.1em;}
.nummey{font-family:"メイリオ",sans-serif;}

/*キャッチ、ボタン部分*/
.toibox{width:90%; margin:20px auto; padding:0;}
.toibox p.c1tex1{ display:inline-block;font-family: 'Zen Maru Gothic', serif; font-size:46px;font-weight:800;letter-spacing: -0.1em; padding:5px 0; color:#e52e5e;line-height:120%;}
.toibox p.c1tex2{ display:inline-block;font-size:45px;font-weight:800; padding:5px 0; margin:10px auto; color:#000;line-height:120%; background:#ffff00;}
.cred{color:#ff0000;}
.f56{font-size:56px;font-weight:800;}
.btn a{font-family: 'Zen Maru Gothic', serif; font-size:46px;font-weight:800;display: inline-block; margin:0 auto 20px;padding: 1em 3em;background-color: #04a300;box-shadow: 0 12px 0 #045e01;border-radius: 60px;color: #fff;cursor: pointer;text-decoration: none;}

/*LINEやり取り1*/
/*自己実現1ラブホ*/
#con1{ width:100%; background:url(../img/hotel_danjyo.png) no-repeat;background-position: center top;background-size: cover;margin:80px auto 20px;padding-top:62.4%;position:relative; }
#con1 .c1ca1{ text-align:center;position:absolute; top:43%; left:5%;background:#000;opacity:0.9;}
#con1 .c1ca1 p{font-size:54px; font-weight:800; padding:5px; color:#fff;line-height:120%;}

/*吹き出し*/
.balloon_l,.balloon_r {margin: 30px 0;display: flex;justify-content: flex-start;align-items: flex-start; padding:0 20px;}
.balloon_r {justify-content: flex-end;}
.faceicon img {width: 100px;height: auto;}
.balloon_r .faceicon {margin-left: 25px;}
.balloon_l .faceicon {margin-right: 25px;}
.balloon_r .faceicon {order: 2 !important;}
.says.girls {max-width: 550px; font-size:25px;text-align:left;display: flex;flex-wrap: wrap;position: relative;padding: 17px 13px 15px 18px;border-radius: 12px;background: #ffdcf0; /*色は任意*/box-sizing: border-box;margin: 0 !important;line-height: 1.5;}
.says.boys {max-width: 550px;font-size:25px; text-align:left;display: flex;flex-wrap: wrap;position: relative;padding: 17px 13px 15px 18px;border-radius: 12px;background: #aaff78; /*色は任意*/box-sizing: border-box;margin: 0 !important;line-height: 1.5;}
.says p {margin: 8px 0 0 !important;}
.says p:first-child {margin-top: 0 !important;}
.says:after {content: "";position: absolute;border: 10px solid transparent;}
.balloon_l .says:after {left: -26px;border-right: 22px solid #ffdcf0;}
.balloon_r .says:after {right: -26px;border-left: 22px solid #aaff78;}
.chat-image {max-width: 100%;height: auto;margin-top: 10px;}

/*特徴*/
#con2{width:100%; margin:60px auto 20px; padding:60px 0; background:#fff;}
#con2 h2{text-align:center; font-size:56px; color:#fff; font-weight:800; line-height:120%; margin-bottom:30px; padding:10px; background:#00b5a0; display:inline-block;}
#con2 .tokuback{background:url(../img/tokuback.png) no-repeat;background-position: center top;background-size: cover;margin:0 auto; padding-top:55.7%;text-align:center;position:relative;}
#con2 .tokuback ul{ position:absolute; top:2%; left:4%; width:92%; margin:0 auto; padding:0;}
#con2 .tokuback ul li{ list-style:none; background:#fff;box-shadow: 6px 6px 1px #444; margin:40px 0; padding:20px 0; opacity:0.9;}
#con2 .tokuback ul li p{font-size:32px; font-weight:800; text-align:left; color:#000; line-height:120%;}
#con2 .tokuback ul li p img{ width:6%; height:auto; padding:0 5px;}

/*安心・安全*/
#con3{width:100%; margin:60px auto 20px; padding:20px 0 0; background:#fff;}
#con3 h2{text-align:center; font-size:56px; color:#00b5a0; font-weight:800; line-height:120%; padding-bottom:30px;}
#con3 h2 img{ width:9%; height:auto; padding:0 5px;}
#con3 ul{display:flex; margin:0 auto 30px; padding:0;}
#con3 ul li{ width:33%; padding:0 5px;list-style:none;}
#con3 ul li p{text-align:center; font-size:21px; color:#000; padding:10px 5px; line-height:140%; font-weight:800;}
.rb{font-weight:800;color:#ff0000;}

/*口コミ*/
#con4{width:100%; margin:60px auto 20px; padding:0 0 10px; background:#fff;}
#con4 .c4h2back{background:url(../img/kuchimommi_wo.png) no-repeat;background-position: center top;background-size: cover;margin:0 auto;padding-top:53.3%;position:relative;}
#con4 .c4h2back h2{position:absolute; top:20%; right:15%;text-align:center; font-size:56px; line-height:120%; color:#fff; background:#00b5a0; padding:10px;box-shadow: 6px 6px 1px #444;}
#con4 ul{ width:96%;display:flex;flex-wrap:wrap; margin:0 auto; padding:0;}
#con4 ul li{list-style:none;margin:0 auto; padding:20px 0;}
#con4 ul li ul{display:flex; width:100%;margin:0 auto; padding:0;}
#con4 ul li ul li.kkimg{list-style:none; width:27%; height:auto; margin:0 auto; padding:0 5px;}
#con4 ul li ul li.kktex{list-style:none; width:68%; margin:0 auto; padding:5px 5px 5px; font-size:19px; text-align:left; line-height:150%; color:#000;}
.nage_w{ display:block; font-size:19px;font-family: "Yu Gothic","游ゴシック"; text-align:left; font-style:italic; color:#e52e5e; padding:7px 0 0 0;}
.nage_m{ display:block; font-size:19px;font-family: "Yu Gothic","游ゴシック"; text-align:left; font-style:italic; color: #03C; padding:7px 0 0 0;}
.f38{font-size:38px;font-weight:800;}

/*LINEやり取り2*/
#con5{width:100%; margin:60px auto 40px; padding:20px 0; background:#8fb6e5;}
.toibox p.c5tex1{ display:inline-block;font-size:36px;font-weight:800; padding:5px 0 0; margin:0px; color:#000;line-height:120%;}
.toibox p.c5tex2{ display:inline-block;font-family:'Zen Maru Gothic', serif;font-size:60px;font-weight:800; padding:0px; margin:0px auto 10px;color:#e52e5e;line-height:120%;letter-spacing: -0.1em;}
.toibox p.c5tex3{ display:inline-block;font-size:28px;font-weight:800; padding:5px 10px; margin:10px auto 10px;color:#000;line-height:150%;background:#ffff00;}

/*ラスト画像テキスト*/
#con6{background:url(../img/lastback.png) no-repeat;background-position: center top;background-size: cover;margin:60px auto 20px;padding-top:65.3%;position:relative; }
#con6 .lastca1{ text-align:center;position:absolute; top:54%; left:5%;right:5%;background:#000;opacity:0.9;}
#con6 .lastca1 p{font-size:54px; font-weight:800; padding:5px; color:#fff;line-height:120%;}

/*topへ*/
.totop{position: fixed;bottom: 20px;right: 16px;}
.totop a{display: block;text-decoration: none;}
.totop:hover{opacity: 0.85 ;}

@media only screen and (max-width: 750px) {
html{font-size: calc(1000vw / 750);}
#container{max-width: none; width:100%; margin:0 auto; padding:0 0 20px;}
.f56{font-size:5.5rem;}
.f56b{font-size:5.2rem;}
.f56kana{font-size:5.5rem;}
header .ca1 p{font-size:4.0rem;padding:5px;line-height:130%;}
header .ca2 p{font-size:4.2rem;padding:5px;line-height:130%;}
.toibox p.c1tex1 {font-size:4.8rem;}
.toibox p.c1tex2{ font-size:4.5rem;}
.btn a {font-size:4.5rem;}
.says.boys {font-size:2.5rem;}
.says.girls{font-size:2.5rem;}
#con1 .c1ca1 p{font-size:5.5rem;}
#con2 h2 {font-size:5.5rem;}
#con2 .tokuback ul li {margin:4rem 0;padding:1.8rem 0;}
#con2 .tokuback ul li p {font-size: 3.2rem;}
.f40b {font-size:4.2rem;}
.f40 {font-size:4.2rem;}
.f38{font-size:4rem;}
#con3 h2 {font-size:5.5rem;}
#con3 ul li p {font-size: 2.2rem;}
.f48{font-size:4.8rem;}
#con4 .c4h2back h2{font-size:5.5rem;}
.toibox p.c5tex1 {font-size: 4.8rem;}
.toibox p.c5tex2 {font-size: 8.5rem;}
.toibox p.c5tex3{font-size: 3.1rem;}
#con6 .lastca1 p {font-size: 5.5rem;}
.nage_w, .nage_m{font-size:2rem}

}
/*btnアニメーション*/
@keyframes heartbeat {
  0% {
    transform: scale(1);
  }
  14% {
    transform: scale(1.1);
  }
  28% {
    transform: scale(1);
  }
  42% {
    transform: scale(1.1);
  }
  70% {
    transform: scale(1);
  }
}

.btn {
  animation: heartbeat 1s infinite;
}
@media only screen and (max-width: 480px) {
.pc { display: none !important; }
.sp { display: block !important; }
#container{ width:100%;margin:0 auto; padding:0 0 140px;}
.totop{position: fixed;bottom: 100px;right: 13px; width:13%;}
header .ca2 {bottom: 12%;}
.faceicon img {width: 80px;height: auto;}
.says.boys {font-size:3.5rem;}
.says.girls{font-size:3.5rem;}
.toibox p.c1tex1 {font-size: 5.0rem;}
#con1{margin:50px auto 20px;}
#con2 {padding: 30px 0;}
#con2 h2 {font-size: 6.5rem;}
#con3 {margin: 40px auto 20px;}
#con3 h2 {font-size: 6.2rem;}
#con3 ul li p {font-size: 4.2rem;}
#con3 ul { display:block;margin: 0 auto 30px;padding: 0;flex-wrap: wrap;}
#con3 ul li {width: 77%;margin: 0 auto 40px;}
#con4 .c4h2back {margin: 0 auto 30px;}
#con4 ul li ul {display:block; margin-bottom:20px;}
#con4 ul li ul li.kkimg {width: 60%; margin:0 auto 10px;}
#con4 ul li ul li.kktex {width: 88%;padding: 5px 5px 5px; font-size:3.5rem;}
.nage_w, .nage_m{font-size:3.8rem}
/*スマホのみ*/
.footbana {display:block; width: 100%;position: fixed; bottom: 0;z-index: 99;background-color: rgba(0,0,0,0.5); padding:15px 0 5px;}
}