@charset "utf-8";

/*//************************************
	settings
------------------------------------//*/
* {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

html {
	height: 100%;
	font-size: 62.5%;
	-webkit-text-size-adjust: 100%;
}

body {
	height: 100%;
}

body, input, textarea, select {
	font-family: sans-serif;
    color: #333;
	font-size: 1.6rem;
	line-height:1.8;
}

/*//-------------------
	basic_structure
-------------------//*/
.wrapper ,
header ,
footer {
	width: 100%;
}

footer a {
color:#FFF;
}

/*//-------------------
	global_tags
-------------------//*/
img {
	max-width: 100%;
}

a {
	text-decoration: none;
}

/*//-------------------
	common
-------------------//*/

.txt {
	font-size: 1.6rem;
	line-height: 1.7;
}

.innerMain {
	margin: 0 auto;
	max-width: 1200px;
}


.inner {
	margin: 0 auto;
	max-width: 880px;
}

.innerTop {
	margin: 0 auto;
	max-width: 100%;
}

.innerTopWidth {
	margin: 0 auto;
	padding:30px 0;
	max-width: 880px;
}

.inner._bxs {
	background: rgba(257,257,257,0.9);
	/*box-shadow: 1px 2px 8px rgba(0,0,0,0.2);*/
}

.inner._bxs2 {
	background: #c65ca7;
	margin-top:0;
}

.inner._bxs3 {
	background: #59b1d8;
	margin-top:0;
}

.inner._bxs4 {
	background: #c65ca7;
	margin-top:0;
}

.inner .btns {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.inner .btns2 {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin:-20px 0;
}

.innerTop._bxs2 {
	background: #784a91;
	margin-top:0;
}

.innerTop .btns {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 25px;
}

.innerTop .btns2 {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.dot_list li {
	display: table;
}

.dot_list li > span {
	display: table-cell;
	vertical-align: top;
}

.dot_list li > .dot {
	width: 15px;
}

/* products */

.products {
	/*background: url(../images/products_bg.jpg) no-repeat center center;*/
	background-size: cover;
	padding: 0% 0 0%;
}

.products .inner {
	border: 4px solid #c65ca7;
	padding: 4% 5%;
	max-width: 880px;
}

.products .txt._2 {
	margin: 4% auto 0;
}

.products .clm2 {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.products .clm2_left {
	margin-right: calc(( 30 / 960 ) * 100%);
}

.products .btn {
	margin: 0 auto;
}

/* campaign */

.campaign {
	background-size: cover;
}

.campaign .inner {
	border: 4px solid #59b1d8;
	padding: 2% ;
	max-width: 880px;
}

.campaign .txt._2 {
	margin: auto;
}

.campaign .clm2 {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.campaign .clm2_left {
	margin-right: calc(( 30 / 960 ) * 100%);
}

.campaign .btn {
	margin: 0 auto;
}

/* zero */

.zero {
	padding-bottom: 3%;
}

.zero._last {
	padding-bottom: 14%;
}

.zero .inner {
	background: url(../images/zero_bg.jpg) no-repeat center center;
	background-size: 100% 100%;
	padding: 4% 5%;
	max-width: 880px;
}

.zero .txt {
	text-align: center;
}

.zero .btn {
	margin-top: 4%;
	text-align: center;
}


/*//-------------------
	header
-------------------//*/

.header .inner {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

/*//-------------------
	footer
-------------------//*/

.footer {
	background: #b194c4;
	padding: 60px 0;
}

.footer .inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.footer .snslist {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	width: 240px;
}

.footer .snslist li {
	display: inline-block;
}

.footer .snslist a {
    background-color: #ffffff;
	border-radius: 100px;
    color: #b194c4;
    display: block;
	font-size: 38px;
	line-height: 1;
    width: 60px;
	text-align: center;
	padding: 11px 0;
}

.footer .copy {
	color: #FFFFFF;
	font-size: 1.1rem;
	padding-top: 40px;
}


/*//-------------------
	pagetop
-------------------//*/

.pagetop a {
	background: #b194c4;
	border-radius: 4px 4px 0 0;
	display: block;
	position: absolute;
	right: 10%;
	bottom: 0;
	width: 160px;
	text-align: center;
}

.pagetop img {
	padding: 10px 0;
	vertical-align: middle;
}

/*//-------------------
	main
-------------------//*/

.main {
	position: relative;
}

/* mv */
.mv {
	background: #f1eeeb;
	/*background: url("../images/10th_main_bg.jpg") no-repeat center center;*/
	background-size: 100% 100%;
}

.sec {
	padding: 80px 0;
}

/* sec._movie */

.sec._movie {
	background: #ebdff0;
}

.sec._movie .heading2 {
	text-align: center;
}

.sec._movie iframe {
	max-width: 100%;
}

.sec._movie .movBox {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}

.sec._movie .movBox iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}

/* sec._ba2 */

.sec._ba2 {
	margin-top: -160px
}

.sec._ba2 .inner {
	max-width: 880px;
}

/* sec._voice */

.sec._voice .head {
	background: url(../images/voice_h2_bg.jpg) no-repeat center center;
	background-size: 100% 100%;
}

.sec._voice .heading2 {
	max-width: 880px;
	margin: 0 auto 3%;
	padding: 3% 0;
}

.sec._voice .line {
	border-bottom: 1px dotted #6b6b6b;
	padding: 4%;
	margin-bottom: 2%;
}

.sec._voice .line-inner {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	max-width: 720px;
	margin: 0 auto;
}

.sec._voice .line._1 .img {
	width: 16%;
}

.sec._voice .line._2 .img {
	width: 21%;
}

.sec._voice .line._3 .img {
	width: 20%;
}

.sec._voice .line .txt {
	font-size: 1.8rem;
	width: 80%;
}

.sec._voice .line._1 .img ,
.sec._voice .line._3 .img {
	margin-right: 4%;
}

.sec._voice .line._2 .img{
	margin-left: 4%;
}

.sec._voice .notes {
	text-align: right;
	font-size: 1.0rem;
}

/* sec._secret */

.sec._secret {
	margin-top: -60px;
	/*margin-bottom: -160px;*/
}

.sec._secret .head {
	background: url(../images/secret_h2_bg.jpg) no-repeat center center;
	background-size: 100% 100%;
}

.sec._secret .heading2 {
	max-width: 880px;
	margin: 0 auto 3%;
	padding: 3% 0;
	text-align: right;
}

.sec._secret .inner {
	background: #FFFFFF;
	padding: 60px 0;
	max-width: 880px;
	margin: 0 auto 30px;
}

.sec._secret .col .body {
	display: none;
	border-bottom: 1px dotted #6b6b6b;
	padding-bottom: 4%;
}

.sec._secret .col {
	padding: 0 20px;
	margin-bottom: 80px;
}

.sec._secret .col._4 {
	margin-bottom: 0;
}

.sec._secret .catch {
	margin: 4% 0;
}

.sec._secret .flex {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

.sec._secret .flex > p {
	width: 50%;
}

.sec._secret .flex > .txt {
	padding: 0 1%;
	font-size: 1.8rem;
}

/* sec._column */

.sec._column {
	background: #ffe3ec url(../images/column_head_bg.png) no-repeat center top;
	background-size: 100% auto;
}

.sec._column .line {
	margin-bottom: 7%;
}

.sec._column .line:last-child {
	margin-bottom: 0;
}

.sec._column .img {
	margin: 2% 0;
	text-align: center;
}

.sec._column .txt {
	font-size: 1.8rem;
	max-width: 770px;
	margin: 0 auto 3rem;
}

.fixedLink{
	position:fixed;
	width:30%;
	bottom:10px;
	right:10px;
}

@media screen and (min-width: 641px){
	.isSp {
		display: none!important;
	}
}

@media screen and (max-width: 640px){
	.isPc {
		display: none!important;
	}

	.inner {
		width: auto;
		margin: 0 4.4%;
	}

	.txt {
		font-size: 3.3vw;
	}

	/*//-------------------
		common
	-------------------//*/	

	/* products */
	
	.products {
		padding: 0px 0;
	}

	.products .inner {
		width: auto;
		padding: 4%;
		margin: 0 2%;
	}
	
	.products .innerTop {
		width: auto;
		padding: 0% 4%;
		margin: 0 0%;
	}
	
	.products .clm2 {
		display: block;
	}
	
	.products .clm2 .clm2_right {
		width: 70%;
		margin: 0 auto 3%;
	}
	
	.products .txt {
		margin-bottom: 6%;
	}
	
	.products .txt._2 {
		margin: 0 0 6% 0;
	}
	
	.products .btns {
		display: block;
		margin: 0 auto;
	}
	
	.products .btns2 {
		display: block;
		margin: 0 auto;
	}
	
	/* campaign */
	
	.campaign {
		padding: 0px 0;
	}

	.campaign .inner {
		width: auto;
		padding: 4%;
		margin: 0 2%;
	}
	
	.campaign .innerTop {
		width: auto;
		padding: 0% 4%;
		margin: 0 0%;
	}
	
	.campaign .clm2 {
		display: block;
	}
	
	.campaign .clm2 .clm2_right {
		width: 70%;
		margin: 0 auto 3%;
	}
	
	.campaign .txt {
		margin-bottom: 0%;
	}
	
	.campaign .txt._2 {
		margin: 0 0 0 0;
	}
	
	.campaign .btns {
		display: block;
		margin: 0 auto;
	}
	
	.campaign .btns2 {
		display: block;
		margin: 0 auto;
	}

	/* zero */

	.zero .inner {
		width: auto;
		padding: 4%;
		margin: 0 4.4%;
	}

	.zero .txt {
		margin-bottom: 7%;
	}

	/*//-------------------
		header
	-------------------//*/	

	.header .inner {
		padding: 2px 0;
	}

	.header .logo {
		width: 100px;
	}

	.header .logo img {
		vertical-align: middle;
	}

	.header .logo._ff {
		width: 120px;
	}

	/*//-------------------
		pagetop
	-------------------//*/	

	.pagetop a {
		border-bottom: 1px solid #FFFFFF;
		border-radius: 0;
		position: static;
		padding: 5px 0;
		width: 100%;
		text-align: center;
	}

	/*//-------------------
		footer
	-------------------//*/	
	.footer {
		padding: 20px 0 50px;
	}

	.footer .clm2 {
		display: block;
	}

	.footer .footer-logo {
		width: 185px;
		margin-bottom: 3%;
	}
	
	.footer .snslist {
		width: 58%;
	}

	/*//-------------------
		main
	-------------------//*/
	/* mv */

	.mv .inner {
		margin: 0;
	}

	.sec {
		padding: 5% 0;
	}
	
	.sec._movie .heading2 {
		width: 70%;
		margin: 0 auto;
	}

	/* sec._ba2 */

	.sec._ba2 {
		margin: 0% 0;
	}

	/* sec._voice */
	
	.sec._voice .head {
		background: url(../images/voice_h2_bg_sp.jpg) no-repeat center center;
		background-size: cover;
	}
	
	.sec._voice .heading2 {
		margin: 0 auto;
		padding: 5% 0 4%;
		text-align: center;
		width: 30%;
	}
	
	.sec._voice .line {
		border-bottom: 1px dotted #6b6b6b;
		padding: 7% 0;
		margin-bottom: 4%;
	}
	
	.sec._voice .line .txt {
		font-size: 3.3vw;
		width: 80%;
	}
	
	.sec._voice .line._1 .img {
		width: 27%;
	}
	
	.sec._voice .line._2 .img {
		width: 39%;
	}
	
	.sec._voice .line._3 .img {
		width: 34%;
	}
	
	.sec._voice .line._1 .img,
	.sec._voice .line._3 .img {
		margin-right: 6%;
	}
	
	/* sec._secret */

	.sec._secret .head {
		background: url(../images/secret_h2_bg_sp.jpg) no-repeat center center;
		background-size: cover;
	}
	
	.sec._secret .heading2 {
		width: auto;
		margin: 0 4.4%;
		padding: 5% 0;
		text-align: right;
	}
	
	.sec._secret .inner {
		width: auto;
		padding: 7% 0;
		margin: 0;
	}

	.sec._secret .col {
		padding: 0 ;
		margin-bottom: 7%;
	}
	
	.sec._secret .col .body {
		display: none;
		border-bottom: 1px solid #6b6b6b;
		padding-bottom: 6%;
	}

	.sec._secret .col .tt {
		padding: 0 4.4%;
	}
	
	.sec._secret .flex {
		display: block;
	}
	
	.sec._secret .flex > p {
		width: auto;
		margin: 0 4.4%;
	}
	
	.sec._secret .flex > .txt {
		font-size: 3.3vw;
	}
	
	.sec._secret .flex > .img {
		margin-bottom: 7%;
	}
	
	.sec._secret .col._2 .img {
		width: 60%;
		margin: 0 auto 3%;
	}	

	.sec._secret .col._3 .img {
		width: 88%;
		margin: 0 auto 3%;
	}	

	.sec._secret .col._4 .img {
		width: 66%;
		margin: 0 auto 3%;
	}	
	
	.sec._secret .catch {
		width: auto;
		margin: 7% 4.4%;
		text-align: center;
	}	
	
	.sec._secret .col._1 .catch img {
		width: 250px;
	}	
	
	.sec._secret .col._2 .catch img {
		width: 220px;
	}	
	
	.sec._secret .col._3 .catch img {
		width: 260px;
	}	
	
	.sec._secret .col._4 .catch img {
		width: 260px;
	}	
	
	/* sec._column */

	.sec._column {
		background-color: #ffe3ec;
		background-image: url(../images/column_head_bg_sp.png), url(../images/column_bottom_bg_sp.png);
		background-repeat: no-repeat, no-repeat;
		background-position: top center, bottom center;
		background-size: 100% auto, 100% auto;
		margin: 0 4.4%;
		padding: 10% 0;
	}
	
	.sec._column .txt {
		font-size: 1.2rem;
		max-width: 770px;
		margin: 0 auto 7%;
	}
	
	.sec._column .img {
		margin: 2% 0 5%;
		text-align: center;
	}
	
	.sec._column .line._3 .img {
		width: 90%;
		margin: 0 auto 5%;
	}
	
	.fixedLink{
	position:fixed;
	width:60%;
	bottom:10px;
	right:10px;
}
}

/* //////////////////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////////////////// */
/* 
.header{
	margin:0 auto;
	width:100%;
	text-align: center;
	background-color: #fff;
}
.headerBox{
	margin:0 auto;
	width:1200px;
	position:relative;
}
.main{
	margin:0 auto;
	width:100%;
	text-align: center;
	background-color: #e2dcdc;
}
.mainBox{
	margin:0 auto;
	width:1200px;
	position:relative;
}
.clickBtn{
	width: 157px;
	margin: 0 auto;
	position: absolute;
	top: 32px;
	left: 121px;
	height: 33px;
}
.clickBtn2{
	width: 220px;
	margin: 0 auto;
	position: absolute;
	top: 109px;
	left: 866px;
	height: 220px;
}

.img{
	margin:0 auto;
	width:100%;
	text-align: center;
}

.offerBg{
	margin:40px auto;
	width:100%;
	text-align: center;
	background-image: url(../images/offer_bg.jpg);
	background-repeat : repeat-x ;
}
.offerBox{
	width:960px;
	margin:0 auto;
	position:relative;
}
.offerBtn{
	width: 960px;
	margin: 0 auto;
	position: absolute;
	top: 455px;
	left: 0px;
}

.zeroBg{
	margin:40px auto;
	width:100%;
	text-align: center;
}
.zeroBox{
	width:960px;
	margin:0 auto;
	position:relative;
}
.zeroBtn{
	width: 960px;
	margin: 0 auto;
	position: absolute;
	top: 125px;
	left: 0px;
}

.baBg{
	margin:80px auto 40px;
	width:100%;
	text-align: center;
	background-image: url(../images/ba_bg.jpg);
	background-size:cover;
}

.movie{
		padding:80px;
		text-align:center;
		background-color:#ebdff0;
	}

.simikesi{
		padding:80px;
		text-align:center;
		background-color:#ffdfed;
	}

.shop{
		padding:80px;
		text-align:center;
		background-color:#fdf0f2;
	}

.voice{
	margin:80px auto 0;
	height:102px;
	width:100%;
	text-align: center;
	background-image: url(../images/user_title.jpg);
	background-repeat: no-repeat;
	background-position: center bottom
}
.voiceBox{
	width:960px;
	margin:0 auto;
	position:relative;
	font-size: 140%;
}


.point{
	margin:80px auto 0;
	height:170px;
	width:100%;
	text-align: center;
	background-image: url(../images/point_title.jpg);
	background-repeat: no-repeat;
	background-position: center bottom
}
.pointBox{
	width:960px;
	margin:0 auto;
	position:relative;
	font-size: 140%;
}


.column{
		text-align:center;
		background-color:#ffe3ec;
		margin-top: 80px;
	}
.columnBox{
	width:960px;
	margin:0 auto;
	position:relative;
	font-size: 140%;
}

.totop{
		text-align:right;
		padding-right: 40px;
		margin-top:80px;
	}
.footer{
		width:100%;
		background-color:#b194c4;
	}
.leftBox{
		float:left;
		padding: 40px;
	}
	
.rightBox{
		float:right;
		padding: 40px;
	} */

/* //////////////////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////////////////// */


	/*アコーディオンcss*/
summary{
position: relative;
max-width: 700px;
	width: 80%;
padding: 10px 50px 10px 20px;
cursor: pointer;
background-color: #a166b7;
color: #fff;
margin: 10px auto;
}
summary::-webkit-details-marker{
position: absolute;
color: transparent;
}
/*summary:hover, details[open] summary {
background-color: #804747;
margin-bottom: 0px;
}*/
summary::after {
content: '+';
font-size: 130%;
position: absolute;
top: 45%;
right: 30px;
transform: translateY(-50%);
transition: transform.5s;
}
details[open] summary::after{
transform:translateY(-50%) rotate(45deg);
}
.answer {
padding: 20px 20px;
background-color: #ffffff;
max-width: 630px;
margin: auto;
}
.answer p {
background: none;
}
details[open] .answer{
animation:fadein .5s ease-in-out;
}
@keyframes fadein {
0% { opacity: 0; }
100%{ opacity: 1; }
}
/*アコーディオンcss*/
