@charset "utf-8";

/*====================

MediaQueries

=====================*/

/*======================================
pc
========================================*/
@media only screen and (min-width: 768px) {
/*------------------------------------------------------------------
表示しない
------------------------------------------------------------------*/
.sp_only,
.keyword_sp,
.etcDaishi_btn a:nth-child(2),
.etcBuntri_btn a:nth-child(2),
.bunrei_btn a:nth-child(2),
.price_plus,
.area_sp,
.br_sp, .btn_sp,
#main .btn_sp,
#priceArea .priceArea {
	display: none;
}
}

/*======================================
スマホ
========================================*/
@media only screen and (max-width: 767px) {

/*------------------------------------------------------------------
表示しない
------------------------------------------------------------------*/
.pc_only,
.etcDaishi_btn a:nth-child(1),
.etcBuntri_btn a:nth-child(1),
.bunrei_btn a:nth-child(1),
.area, .br_pc,
#main .btn,
.anchor {
	display: none;
}

/*------------------------------------------------------------------
max-width: 500px; width: 96%;
------------------------------------------------------------------*/
.notify, #daishi, #bunrei {
	margin: 0 auto;
	max-width: 500px;
	width: 96%;
}
.bunrei_btn + .no_number_list {
    width: 100%;
}
/*ここから*/
/*======================================

========================================*/


#headArea {
	position:static;
	/*max-width: 1300px;*/
	width: 100%;
	height: min(1000 / 767 * 100vw, 1000px);
	margin: 0 auto;
	background: url(../img/s/mainBK.jpg) no-repeat border-box center / cover #4F4F51;
}

#headArea h1 {
	position: static;
	background: #009FFF;
	width: 80%;
	margin-left: 10%;
	/*left: 10%;
	top: min(50 / 1300 * 100vw, 50px);
	left: min(650 / 1300 * 100vw, 650px);
	/*padding: 5% 5% 8% 5%;*/
}
#headArea h1 img {
	width: 75%;
	height: auto;
	max-width: 458px;
}

#headArea .daishi1 {
 position: absolute;
	top:min(850 / 767 * 100vw, 850px);
	left: min(70 / 767 * 100vw, 70px);
	width: min(417 / 767 * 100vw, 417px);
}
#headArea .daishi1 img {
	width: 90%;
	height: auto;
}

#headArea .fukuro {
	clear: both;
	position: absolute;
	width: min(374 / 767 * 100vw, 374px);
   height: min(320 / 767 * 100vw, 320px);
	left: min(15 / 767 * 100vw, 15px);
	top: min(500 / 767 * 100vw, 500px);
}
#headArea .fukuro img {
	width: 100%;
	height: auto;
}

#headArea .usagi {
	position: absolute;
	width: min(375 / 767 * 100vw, 375px);
   height: nin(365 / 767 * 100vw, 365px);
	left: min(350 / 767 * 100vw, 350px);
	top: min(600 / 767 * 100vw, 600px);
}
#headArea .usagi img {
	width: 100%;
	height: auto;
}





/*======================================
main
========================================*/

#main {
	width: 100%;
	margin: 0 auto;
	background: #fff;
}
/*------------------------------------------------------------------
animation
------------------------------------------------------------------*/
 
.scroll-space {
	width: 100%;
   box-sizing: content-box;
    padding-top: 10px;
    height: 80px;
    color: #fff;
	text-align: center;
}

.scroll-space .image {
    width: 30vw;
    height: 30vw;
	text-align: left;
}

.scroll-space .image2 {
    width: 30vw;
    height: 30vw;
	text-align: right;
}
.scroll-space .image img,
.scroll-space .image2 img{
		width: 100%;
	}
	
/*------------------------------------------------------------------
ページ内リンク
------------------------------------------------------------------*/
#anchor_link {
	width: 95%;
	margin: 2rem auto;
}

#anchor_link li a{
	  position: relative;
  display: inline-block;
  vertical-align: middle;
  padding: 1em;
  width: 100%;
  height: 100%;
  color: #fff;
  text-decoration: none;
  text-align: center;
  background: #00B4FF;
  box-sizing: border-box;
	font-size: 1.6rem;
}
#anchor_link li a::before,
#anchor_link li a::after {
	  content: "";
  position: absolute;
  bottom: 0;
  left: calc(90% - 2px);
  top: calc(45% - 2px);
  width: 2px;
  height: 10px;
  border-radius: 9999px;
  background-color: #fff;
  transform-origin: 50% calc(100% - 1px);
}
 }
	
	@media only screen and (max-width: 480px) {
		#anchor_link li a{
	  	position: relative;
  		display: inline-block;
  	vertical-align: middle;
  padding: 1em 0.1em;
  width: 100%;
  height: 100%;
  color: #fff;
  text-decoration: none;
  text-align: center;
  background: #00B4FF;
  box-sizing: border-box;
	font-size: 1.0rem;
}
		#anchor_link li a::before,
#anchor_link li a::after {
	  content: "";
  position: absolute;
  bottom: 0;
  left: calc(93% - 2px);
  top: calc(45% - 2px);
  width: 2px;
  height: 6px;
  border-radius: 9999px;
  background-color: #fff;
  transform-origin: 50% calc(100% - 1px);
}
	}
	
	
@media only screen and (max-width: 767px) { 
/*------------------------------------------------------------------
daishiArea
------------------------------------------------------------------*/

#daishiArea {
	width: 95%;
	max-width: 884px;
	margin: 0 auto;
	padding: 5% 20px;
}

#daishiArea h2 {
	font-family: Hiragino Mincho Pr6N, Hiragino Mincho ProN, Yu Mincho, YuMincho, serif;
	font-size: 2rem;
	text-align: center;
	padding-bottom: 30px;
}
#daishiArea .read {
	font-size: 1.6rem;
	line-height: 1.8;
	padding-bottom: 40px;
	width: 90%;
	margin: 0 auto;
}
	.daishiImg {
		text-align: center;
		width: 90%;
		height: auto;
		margin: 0 auto;
		display: flex;
		flex-flow: column;
		
align-items: center;
	}
#daishiArea .daishiImg .omote {
	width: 80%;
	margin-bottom: 30px;
}
#daishiArea .daishiImg .ura {
	width: 80%;
	padding-top: 0;
	margin-bottom: 30px;
}
#daishiArea .daishiImg .mihiraki {
	width: 80%;
	margin-bottom: 30px;
}
#daishiArea .size {
	font-size: 1.4rem;
}
	
#daishiArea .price {
	font-size: 2rem;
	font-weight: bold;
	text-align: center;
}
#daishiArea .price span {
	font-size: 3rem;
	color: #0077ff;
}
#daishiArea .price span.blue {
	color: #0077ff;
	font-size: 2.0rem;
}

#daishiArea #detail {
	background: #009fff;
	padding: 32px 30px;
	border-radius: 1.5rem;
	margin: 60px auto 0 auto;
}

#daishiArea #detail h2 {
 font-size: 2rem;
} 
#daishiArea #detail h2 img {
	width: 100%;
	/*max-width: 381px;*/
}

 #detail .flex {
	display: block;
}
 #detail .flex .image {
	width: 100%;
	position: static;
	 text-align: center;
}
 #detail .flex .image2 {
	width: 100%;
	position: static;
	 	 text-align: center;
}
#detail .flex img {
	width: 70%;
}
 #detail .flex .left {
	margin: 0 0 2rem;
	padding: 0;
}
 #detail .flex .right {
	margin: 2rem 0 2rem;
	padding: 0;
}
 #detail .flex h3 {
	margin: 0;
	padding: 0;
	font-weight: bold;
	font-size: 2.5rem;
}
 #detail .flex .text {
	margin: 10px 0 0;
	padding: 0;
	font-size: 1.6rem;
	line-height: 1.8;
}
#priza_option {
	padding: 30px 0 10px 0;
	width: 100%;
	text-align: center;
}
#priza_option h2 {
	width: 100%;
	margin-bottom: 0;
	padding-bottom: 0;
}
#priza_option h2 img {
	width: 90%;
}
#priza_option .prizaArea {
	display: block;
	padding-bottom: 2rem;
}
#priza_option .prizaArea .right {
	width: 100%;
	margin: 0 auto;;
	padding: 0;
}
#priza_option .prizaArea h3 {
	font-family: Hiragino Mincho Pr6N, Hiragino Mincho ProN, Yu Mincho, YuMincho, serif;
	font-size: 7rem;
	text-align: center;
	padding-bottom: 30px;
	line-height: 6rem;
}
#priza_option .prizaArea h3 span {
	font-size: 3rem;
}
#priza_option .prizaArea h3 i {
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: 2.5rem;
	line-height: 3rem;
}
#priza_option .prizaArea .image {
	width: 100%;
	position: relative;
	text-align: center;
}
#priza_option .prizaArea .image img {
	width: 90%;
	max-width: 402px;
}

#priza_option .prizaArea .text {
	margin: 0.5rem 2rem 0 0;
	padding: 0;
	font-size: 1.8rem;
	line-height: 1.8;
}

/*------------------------------------------------------------------
profile
------------------------------------------------------------------*/
#profile {
	width: 95%;
	margin: 0 auto;
	border: #878787 solid 1px;
	background: #fff;
	padding: 3rem 0;
	display: block;
}

#profile .jimmyImg {
	width: 75%;
	margin: 0 auto;
	text-align: center;
	
}
#profile .jimmyImg img {
	width: 100%;
	max-width: 305px;
}

#profile .profileText {
	width: 90%;
	font-size: 90%;
	margin: 0 auto;
}
/*#profile .profileText .title {
	font-size: 3rem;
}
#profile .profileText .name {
	font-size: 2rem;
}
#profile .profileText .name span {
	font-size: 1.5rem;
}*/

/*------------------------------------------------------------------
#bunreiArea
------------------------------------------------------------------*/
#bunreiArea {
	width: 100%;
	margin: 2rem auto;
	max-width: 960px;
	height: auto;
}
#bunreiArea h2 {
	font-size: 3rem;
}

#bunreiArea h2 img {
	width: 100%;
}



#bunreiArea .bunreiBK {
background: #C7EBFF;
	padding: 1rem 0px;
	width: 100%;
	height: auto;
	text-align: center;
}
#bunreiArea .bunreiBK .bunrei {
	border: #00B4FF solid 3px;
	border-radius: 10px;
	padding: 30px 10px 10px;
	background: #fff;
	width: 90%;
	height: auto;
	margin: 2rem auto;
}
#bunreiArea .bunreiBK .bunrei h3,
#bunreiArea .bunreiBK .bunrei h3.birth,
#bunreiArea .bunreiBK .bunrei h3.biz {
	font-size: 2.5rem;
}


#bunreiArea .bunreiBK .bunrei .number {
	background: #F2E1FF;
	text-align: center;
	padding: 5px 0;
	font-size: 1.5rem;
	width: 100%;
	height: auto;
}
#bunreiArea .bunreiBK .bunrei .bunreiText {
	background: linear-gradient(to bottom, #fff 30%, #CAF0FF);
	padding: 5% 5% 2%;
	font-size: 1.8rem;
	width: 90%;
	height: auto;
	text-align: left;
}
#bunreiArea .bunreiBK .bunrei .bunreiText span {
	display: block; 
	text-align: right;
	font-size: 1.5rem;
}

#bunreiArea .bunreiBK .bunrei .line {
  height: 4px;
  border-width: 0;
  background-repeat: repeat-x;
  background-size: 0.7em 0.3em,1.7em 0.3em,3.5em 0.3em,3.7em 0.3em;
  background-position: right bottom;
  background-image:
  radial-gradient(0.3em 0.2em at center center,#00CCFF,rgba(246,89,115,0)),
  radial-gradient(0.5em 0.2em at center center,#00CCFF,rgba(246,89,115,0)),
  radial-gradient(0.8em 0.2em at center center,#00CCFF,rgba(246,89,115,0)),
  radial-gradient(7.2em 0.2em at center center,#00CCFF,rgba(246,89,115,0));
}

#bunreiArea .bunreiBK .btn_wrapper {
  	display: block;
/*	justify-content: center;*/
	margin-top: 20px;
	text-align: center;
}
#bunreiArea .bunreiBK .btn_wrapper .daishi {
	width: 100%;
}

#bunreiArea .bunreiBK .btn_wrapper .daishi1073 img {
	width: 70%;
	padding-bottom: 1rem;
}

#bunreiArea .bunreiBK .btn_wrapper .daishi1074 img {
	width: 70%;
	padding-bottom: 1rem;
	padding-top: 3rem;
}
	#bunreiArea .bunreiBK .btn_wrapper p {
		padding: 0;
		margin: 0;
		align-items: center;
	}

#bunreiArea .bunreiBK .btn_wrapper .btn_sp {
font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1.2rem 1rem;
  cursor: pointer;
 /* -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;*/
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  /*letter-spacing: 0.1em;*/
  color: #fff;
  border-radius: 2rem;
	width: 90%;
}
	.mgL00 {
		margin-left: 0!important;
	}

	#bunreiArea .bunreiBK .btn_wrapper p {
		padding-left: 0;
	}
#bunreiArea .bunreiBK .btn_wrapper p span {
	font-size: 2rem;
}
#bunreiArea .bunreiBK .btn_wrapper p span::before{
	content: "";
	display: inline-block;
	background-image: url("../img/icon_plus.png");
	background-size:cover;
	background-repeat: no-repeat;
	width: 1em;
	height: 1em;
	margin-right: 0.2em;
}
	.notice {
		margin-left: 2rem;
		margin-right: 2rem;
	}
	
	
/*------------------------------------------------------------------
button
------------------------------------------------------------------*/
.buttonArea {
	text-align: center;
	padding: 30px 0;
	margin: 0;
	width: 100%;
}
.btn_sp,
.btn,
a.btn,
button.btn {
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.5;
  position: relative;
  display: inline-block;
 padding: 1.5rem 0rem;
  cursor: pointer;
 /* -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;*/
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  /*letter-spacing: 0.1em;*/
  color: #fff;
  border-radius: 2rem;
	width: 90%;
	margin: 0 auto;
}

.btn--red,
a.btn--red {
  color: #fff;
  background-color: #ce0311;
}

.btn--red:hover,
a.btn--red:hover {
  color: #fff;
  background: #ce0311;
	opacity: 0.7;
}
	
.mgT20 {
	margin-top: 2rem;
}

	
/**/
	
.etc_btnArea {
	display: block;
text-align: center;
	margin-top: 3rem;
}
.etcBuntri_btn {
  display: inline-block;
	width: 90%;
	max-width: none;
	height:auto;
  line-height: 60px;
  text-align: center;
  text-decoration: none;
  color:#1B85FB;
  background-color: #fff;
	border: #1B85FB solid 2px;
	margin: 10px 0 0;
	font-size: 1.8rem;
	border-radius: 2rem;
}
.etcBuntri_btn a {
  display: inline-block;
	height: auto;
  line-height: 60px;
  text-align: center;
  text-decoration: none;
  color: #1B85FB;
  background-color: #fff;
  position: relative;
border-radius: 2rem;
	width: 100%;
}
.etcBuntri_btn a::before {
  border-right: 2px solid #1B85FB;
  border-top: 2px solid #1B85FB;
  bottom: 0;
  content: "";
  height: 10px;
  width: 10px;
  margin: auto;
  position: absolute;
  right: 15px;
  top: 0;
  transform: rotate(45deg);
  transition: right .3s;
}
.etcBuntri_btn:hover{
	opacity: 0.8;
}
	
.etcDaishi_btn {
  display: inline-block;
  width: 90%;
	max-width: none;
	height: auto;
  line-height: 60px;
  text-align: center;
  text-decoration: none;
  color: #fff;
  background-color: #1B85FB;
border: #1B85FB solid 2px;
	margin: 20px auto;
	font-size: 1.8rem;
	border-radius: 2rem;
}
.etcDaishi_btn a {
  display: inline-block;
  width: 100%;
  line-height: 60px;
  text-align: center;
  text-decoration: none;
  color: #fff;
  background-color: #1B85FB;
  position: relative;
		border-radius: 2rem;
}
.etcDaishi_btn a::before {
  border-right: 2px solid #fff;
  border-top: 2px solid #fff;
  bottom: 0;
  content: "";
  height: 10px;
  width: 10px;
  margin: auto;
  position: absolute;
  right: 15px;
  top: 0;
  transform: rotate(45deg);
  transition: right .3s;
}
.etcDaishi_btn:hover {
	opacity: 0.8;
}




/*======================================
info
========================================*/
aside#info {
	border: none;
	background-color: #fff;
	margin-top: 0!important;
}
#info .check h3 {
	background: url(../img/s/arrow_check.png) no-repeat center bottom;
	background-size: auto 22px;
}
#brushlet p img {
	width: 100%;
}
#apply, #brushlet, .accept_sp {
    margin: 0 auto;
    max-width: 500px;
}
#brushlet .img {
	margin: 20px auto 0;
	max-width: 300px;
}
.message {
    margin: 2rem 2% 0;
    /* text-align: center; */
}

/*------------------------------------------------------------------
accept
------------------------------------------------------------------*/
.accept_sp .operator:before, .accept_sp .contact:before, .accept_sp .operator, .accept_sp .contact {
    border-top-color: #adbbd8;
}
.accept_sp .call img {
    max-width: 300px;
}
.accept_sp .call {
	background-color: #B694FF;
}
.accept_sp .call a {
	background-color: #B694FF;
}

/*======================================
attention_sp.php
========================================*/
.value, .prearrival {
	background-color: transparent;
}
.attent {
	background-color: #c1e4f7;
}

/*======================================
footer
========================================*/
#footer_sp {
	background-color: #fff;
}

/*======================================
2020.3.1 追記
========================================*/

	#check {
		display: block;
		width: 100%;
		padding: 20px 0;
	}

	#check dt {
		text-align: center;
		display: block;
		padding-right: 0;
		height: auto;
		background: url(../img/s/arrow_check.png) no-repeat center bottom;
		padding-bottom: 30px;
		background-size: auto 22px;
	}

	#check dd {
		margin: 5px 0;
		display: flex;
		justify-content: center;
	}
	
	#check ol li {
		font-size: 1.4rem;
	}

	.keyword_sp {
		font-size: 1.1rem;
		margin-top: 10px;
		padding-left: 1rem;
		text-indent: -1rem;
		text-align: left;
	}

	.keyword_sp {
		font-size: 1.2rem;
		text-align: center;
	}

	.daishi_column .keyword_sp {
		margin: 10px 40px 0;
	}

	#apply,
	#brushlet,
	.accept_sp {
		max-width: 400px;
		margin: 0 auto;
	}

	#brushlet h2 + p img {
		width: 160px;
	}
	
	#brushlet p img {
		width: 80%;
	}

	#brushlet  #img_brushlet img {
		max-width: 300px;
		width: 80%;
		margin: 0 auto;
	}

	#footer_sp .pagetop {
		border-top: none;
	}

#footer_sp .pagetop a {
	font-size: 1.2rem;
	padding: 15px 0 0 14px;
	background-position: left 16px;
}

.accept_sp dl dd {
	padding-left: 1.6rem;
}

.accept_sp ul li {
	font-size: 1.2rem;
}

.price_plus dd span {
	font-size: 1.2rem;
	line-height: 1.4;
}

/*-----------------------------
20201201 追記
----------------------------*/

.message_baby {
	display: block;
	margin-top: 10px;
}

.message_baby li {
	font-size: 1.2rem;
	padding-left: 1.2rem;
	text-indent: -1.2rem;
	margin-top: 2px;
	line-height: 1.6;
}


}
