@charset "utf-8";
/*=============================================================
 Layout
=============================================================*/
#contentsWrap{
	background:#e85382;
	background-size: 100% auto;
}
.contents{
	padding: 0 5%;
}
.bg01{
	padding: 5% 5% 10%;
	background: #fff url("../img/bg_ctop.png") no-repeat 0 0;
	background-size: 100% auto;
}
.contents .pageBox{
	padding: 5%;
	border: 6px solid #e85382;
	border-top: none;
	border-radius: 0 0 15px 15px;
	background: #fff;
}
.contents.bgPink .pageBox{
	border: 6px solid #fdd000;
}
/* #mainvisual
-------------------------------------------------------------*/
#mainvisual {
}
#mainvisual h1 {
	width: 100%;
	max-width: 640px;
	margin: 0 auto;
}
#mainvisual h1.setScMc{
	opacity:0;
	transform:translateY(0px);
}
#mainvisual h1.setScMc.enter{
	opacity:1;
}
/* #intro
-------------------------------------------------------------*/
#intro{
	padding: 15% 10%;
	background: #fff;
}
#intro .txtLead{
	width: 100%;
	margin: 0 auto;
	padding: 0 0 3em;
}
#intro .btn{
	width: 60%;
	margin: 0 auto;
}
/* TTL
-------------------------------------------------------------*/
.contents .ttlH2{
	width: 100%;
	position: relative;
}
.contents .ttlH2 h2{
	width: 100%;
	background: #fdd000;
	border-radius: 15px 15px 0 0;
	position: relative;
	padding: 7% 0;
}
.contents .ttlH2 h2.pink{
	background: #e85382;
}
.contents .btnMore{
	padding: 0 8%;
}




/* #outline
-------------------------------------------------------------*/
#outline {
	padding: 6% 0;
	font-size: 105%;
	text-align: center;
}
#outline .ttlH2 h2{
	padding: 4% 0;
}
#outline .ttlH2 h2 span{
	display: block;
	margin: 0;
	position: absolute;
	top: -30%;
	left: -5%;
	right: -3%;
}
#outline .note {
	padding: 1em 0 0;
	text-align: center;
}
/* #entry
-------------------------------------------------------------*/
#entry .ttlH2 h2{
	padding: 4%;
}
#entry .ttlH2 h2 span{
	width: 20%;
	display: block;
	margin: 0;
	position: absolute;
	top: -5%;
	left: -2%;
}
#entry .present {
	margin-left: -2.6%;
}
#entry h3 {
	padding: 6% 10% 0;
}
#entry h4 {
	padding: 10% 0 5%;
}
#entry .box p {
	font-size: 120%;
}
#entry .box {
	padding: 1em 0 0;
}
#entry .box a {
	color: #0087ff;
}
#entry .btm {
	padding: 2em 0 0;
}
#entry .note {
	padding: 1em 0 0;
	text-align: left;
}
/* #conditions
-------------------------------------------------------------*/
#conditions {
	padding: 6% 0 0;
}
#conditions .kiyaku_wrap {
	height: min(48.167vw, 289px);
	overflow-y: auto;
	overflow-x: hidden;
}
#conditions .kiyaku_inner {
	width: 100%;
	padding: 0 20px 0 0;
	font-size: 90%;
}
#conditions .kiyaku_inner p.ttlLine {
	margin: 1.5em 0 0.5em;
	padding: 0 0 0.5em;
	border-bottom: 1px dotted #333;
}
#conditions #entryBtnBox {
	width: 80%;
	margin: 3em auto 0;
}
#conditions .tableBox {
	width: 100%;
	overflow-x: auto;
}
#conditions table {
	width: 100%;
}
#conditions table th,
#conditions table td{
	padding: 5px;
	border: 1px solid #ddd;
	white-space: nowrap;
}
#conditions table th{
	background-color: #eee;
}
/* #entryBtn
-------------------------------------------------------------*/
#entryBtn{
	padding: 2% 0 10% 0;
	font-size: 120%;
	color: #fff;
}
#entryBtn p{
	margin: 0 3em;
}
#entryBtn p.atn{
	margin: 2em 1em;
}
#entryBtn p.atn a{
	color: #ffff00;
}
/* #faq
-------------------------------------------------------------*/
#faq{
	padding: 6% 0 0 0;
}
#faq dl{
	font-size: 115%;
}
#faq dt {
	width: 100%;
	display: flex;
	align-items: center;
}
#faq dt div.icn {
	width: 10%;
}
#faq dt p {
	width: 90%;
	padding-left: 1em;
	font-weight: 600;
}
#faq dd {
	width: 100%;
	display: flex;
	margin-top: 1em;
}
#faq dd div.icn {
	width: 10%;
}
#faq dd p {
	width: 90%;
	padding-left: 1em;
}
#faq dd + dt {
	margin: 1em 0 0;
	padding: 1.2em 0 0;
	border-top: 2px dotted #000;
}
#faq dl a {
	color: #0087ff;
}
/* #otoku
-------------------------------------------------------------*/
#otoku {
	font-size: 120%;
}
#otoku h4 {
	font-weight: 500;
	margin: min(3vw, 18px) 0 min(3vw, 18px);
}
#otoku ul {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	width: 100%;
	margin: 0 auto min(8.333vw, 50px);
}
#otoku ul li {
	flex-basis: 50%;
	text-align: center;
}
#otoku ul li .howto_img {
	margin: 0 auto min(1.833vw, 11px);
}
#otoku ul li .howto_img img {
	max-height: min(21vw, 180px);
}
#otoku ul li p {
	line-height: 1;
	margin: 0 auto min(1.333vw, 8px);
	text-align: center;
}
#otoku ul li .price {
	font-size: min(5.167vw, 29px);
	font-weight: 700;
	line-height: 1;
	color: #e85382;
	margin: 0 auto min(1.833vw, 11px);
}
#otoku ul li .price span {
	font-size: min(6.333vw, 38px);
	font-weight: 500;
	display: inline;
	padding-right: 0;
	line-height: 1;
}
#otoku ul li span {
	display: block;
	font-size: min(2.833vw, 17px);
	line-height: 1.9;
	text-align: left;
	padding-right: min(5vw, 30px);
}
#otoku ul li:first-child {
	border-right: 2px dotted #141414;
}
#otoku .howto {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin: min(3.833vw, 23px) auto min(9vw, 54px);
}
#otoku .howto .image {
	flex-basis: min(24vw, 180px);
}
#otoku .howto .image img {
	max-width: 100%;
}
#otoku .howto .summary {
	flex-basis: min(48vw, 270px);
}
#otoku .howto .summary .price {
	font-size: min(5.167vw, 29px);
	font-weight: 700;
	line-height: 1;
	color: #e85382;
}
#otoku .howto .summary .price span {
	font-size: min(6.333vw, 38px);
	font-weight: 500;
}
#otoku .howto .summary .price .small {
	font-size: min(3.5vw, 21px);
}
#otoku .howto .summary h5 {
	line-height: 2.1;
}
#otoku .howto .summary .info {
	font-size: min(2.833vw, 17px);
	font-weight: 400;
}
/* #easy
-------------------------------------------------------------*/
#easy {
	font-size: 115%;
	padding: 6% 0 0 0;
}
#easy .line {
	margin: 2.5em 0 0;
	padding: 2.7em 0 0;
	border-top: 2px dotted #000;
}
#easy .boxClm {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
#easy .boxClm .boxFig{
	width: 37%;
}
#easy .boxClm .boxTxt{
	width: 59%;
}
#easy .boxClm .boxTxt strong{
	font-size: 105%;
}
#easy .boxClm .boxTxt .price{
	font-size: min(5.167vw, 31px);
	font-weight: 700;
	line-height: 1;
	color: #e60012;
}
#easy .boxClm .boxTxt .price span {
	font-size: min(6.333vw, 38px);
	font-weight: 500;
}
/* #contact
-------------------------------------------------------------*/
#contact .base {
	width: 100%;
	text-align: center;
	color: #fff;
	padding: 3em 0;
}
#contact .base h2{
	padding-bottom: 0.8em;
	font-size: 180%;
	position: relative;
}
#contact .base h2:after {
		content: "";
		background-color: #fff;
		width: 50px;
		height: 6px;
	border-radius: 9999px;
		position: absolute;
		bottom: 0;
		left: 50%;
		transform: translateX(-50%);
}
#contact .base h3{
	font-size: 120%;
}
#contact .base p.telnum{
	font-size: 240%;
	padding: 0.7em 0 0.7em;
	position: relative;
	font-weight: 700;
}
#contact .base a{
	color: #fff;
}
#contact .base p{
	display: inline-block;
	text-align: left;
	padding: 0 3em;
	font-size: 120%;
}