@charset "utf-8";

/*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, sup, 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 {
    font-size:100%;
    line-height: 1;
    margin: 0; padding: 0;
    vertical-align:baseline;
}
div,h1,h2,h3,h4,h5,h6,p,dl,dt,dd,ol,ul,li,form,input,textarea,button,table,tr,th,td,article,aside,footer,header,hgroup,nav,section{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
ul, dl { list-style: none; }
a {
    font-size:100%;
    vertical-align:baseline;
}
img { vertical-align: bottom; }
input, button, textarea, select { 
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/*clearfix*/
.cf:before,
.cf:after {
content: " ";
display: table;
}
.cf:after {
clear: both;
}
.cf {
*zoom: 1;
}

/*layout*/
html { height: 100%; }
body { height: 100%; margin: 0; padding: 0; background:#fff url(http://honeymagazine.net/fr/img/bg_vr2_sp_fr.jpg) no-repeat center 30px; background-size: 100% auto; color:#222; font-family: Gill Sans, Arial, Sans-Serif; font-size:16px; -webkit-text-size-adjust: none; }
#wrap { margin: 0 auto; width: 100%; /*height: 85%; コンテンツが短いときだけ使用*/ position: relative; background: url(http://honeymagazine.net/fr/img/honeycomb.png) no-repeat center bottom; background-size: 100% auto; }
#wrap #header { margin: 0 auto; height: 30px; position: relative; }
#wrap #header p { margin: 0 auto auto 15px; padding-top: 8px; width: 130px; }
#wrap #header p img { width: 100%; }
#wrap #header ul { position: absolute; right: 20px; top: 3px;}
#wrap #header ul li { font-size: 14px; }

#wrap h1 { /*事前登録終了後*/ margin-bottom: 30px; position: relative; }
#wrap h1 > img { margin: 0 auto; width: 100%; z-index: 5; }
#wrap h1 > img.pc { display: none; }
/*1st Anv*/
#wrap h1 p { position: absolute; margin: 0 0 0 -7.66vw; width: auto; height: 100%; bottom: 0.266vw; left: 0; right: 0; z-index: 2; overflow: hidden;}
#wrap h1 p img { height: 96.626%; position: absolute; margin: auto auto 0; bottom: 0; left: 0; right: 0;  }


#wrap p.catch { margin: 10px auto; text-align: center; font-size: 16px; color: #c9b379;  }

#wrap div.regist { margin: 16px auto; width: 80%; position: relative; font-size: 0; }
#wrap div.regist input,#wrap .regist button { border: solid 2px #eddba7;  height: 44px; font-size: 18px; line-height: 24px; vertical-align: bottom;
   -moz-border-radius: 22px;
-webkit-border-radius: 22px;
		border-radius: 22px; }
#wrap div.regist input { width: 80%; margin-right: 2%; padding: 2px 12px; }
#wrap div.regist button { width: 18%; color: #ec1d6f; font-family: Gill Sans, Arial, Sans-Serif; font-size: 22px; font-weight: 600; }
#wrap div.regist input::-webkit-input-placeholder { font-family: Gill Sans, Arial, Sans-Serif; font-size: 22px; color: #bcadad; font-weight: 600; }
#wrap div.regist input::-moz-placeholder { font-family: Gill Sans, Arial, Sans-Serif; font-size: 22px; color: #bcadad; font-weight: 600; }
#wrap div.regist input:-ms-input-placeholder { font-family: Gill Sans, Arial, Sans-Serif; font-size: 22px; color: #bcadad; font-weight: 600; }


#wrap ul.dl-btn { margin: 0 auto 30px; width: 83.066% /*80%*/; }
#wrap ul.dl-btn li { float: left; width: 31% /*47.5%*/; margin-left: 2.33%; }
#wrap ul.dl-btn li:first-child {  margin-left: 0;/*margin-right: 5%*/; }
#wrap ul.dl-btn li p { margin-top: 3px; text-align: center; font-size: 10px; font-weight: 200;}


#wrap ul.sns { margin: 0 auto; text-align: center; }
#wrap ul.sns li { display: inline; margin: 0 15px; }
#wrap ul.sns li img { height: 26px; }

#footer { width: 100%; margin-top: 60px; padding: 10px 0; color: #ccc; text-align: center; border-top: solid 1px #ccc; }
#footer p.copyright { font-size: 11px; line-height: 1.5; }
#footer p.info { font-size: 11px; line-height: 1.5;}

/*contents*/
#wrap .gpBox { margin: 0 auto 35px; width: 87.73%; }
#wrap .gpBox img { width: 100%; }
#wrap .gpBox h3 { margin-bottom: 12px; }
#wrap .gpBox p { margin: 0 auto 0.8em; font-size: 14px; line-height: 1.3; font-weight: 300; color: #c9b379; }
#wrap .gpBox p strong { color: #ec1d6f; font-weight: 300; }

#wrap hr { border-top: solid 1px #8c8c8c; margin-bottom: 40px; }

/*#wrap div#part3 { margin: 0 auto 50px; width: 100%; overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
#wrap div#part3 { margin: 0 auto 50px; width: 100%; overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
#wrap div#part3::-webkit-scrollbar { display: none; height: 0 !important; }
#wrap div#part3 ul { margin: 0 16%; width: 200%; }
#wrap div#part3 ul > * { -webkit-transform: translateZ(0px); }
#wrap div#part3 ul li { margin: 0 3.5%; width: 26%; float: left; }
#wrap div#part3 ul li img { width: 100%; }*/

#wrap div#part3 { margin: 0 auto 80px; }
#wrap div#part3 ul.slider02 li { position: relative; }
#wrap div#part3 ul.slider02 li p:before { content: " "; display: block; position: absolute; z-index: 1; width: 90%; height: 61.803%; margin: 0 auto; left: 0; right: 0; border: solid 2px #eddba7; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; }
#wrap div#part3 ul.slider02 li img{ position: relative; z-index: 5; margin: 0 auto 0; padding-top: 10.526%; width: 76%; }


#wrap div#part4,#wrap div#part5 { margin: 0 auto 80px; text-align: center; }
#wrap div ul.slider01 li p img { width: 66%; margin: 0 17%; }

#wrap div#part6 div.banner { margin: 0 auto 40px; width: 81.33%; }

@media screen and (min-width: 768px) { 
	body { background: #fff url(http://honeymagazine.net/fr/img/bg-s_vr2_pc_fr.jpg) no-repeat left 30px; }
	#wrap { margin: 0 auto; width: 995px; background: none; }
	
	
	#wrap h1 { /*width: 87.73%;*/ height: 357px;/*事前登録終了後*/ margin-bottom: 60px; }
	#wrap h1 img.pc { display: block; margin: 0 auto; position: absolute; left: 64px/*81px*/; top: 112px; width: 579px;}
	#wrap h1 img.sp { display: none; }
	/*1st Anv*/
	#wrap h1 p { margin: 0 auto 0 -68px; width: 1122px; bottom: 1px; }
	#wrap h1 p img { height: auto; width: 100%; }
	
	#wrap p.catch { margin: 20px auto; font-size: 28px; }
	
	#wrap div.regist { width: 486px; margin-bottom: 68px; }
	#wrap div.regist input,#wrap .regist button { height: 70px; font-size: 24px; line-height: 70px; 
	   -moz-border-radius: 35px;
	-webkit-border-radius: 35px;
			border-radius: 35px; }
	#wrap div.regist input { padding: 5px 20px; }
	#wrap div.regist button { cursor: pointer; font-size: 35px; }
	#wrap div.regist input::-webkit-input-placeholder { font-size: 30px; }
	#wrap div.regist input::-moz-placeholder { font-size: 30px; }
	#wrap div.regist input:-ms-input-placeholder { font-size: 30px; }
	
	#wrap ul.dl-btn { width: 770px /*656px*/ /*495px*/; margin-bottom: 40px; }
	#wrap ul.dl-btn li { width: 240px /*202px*/; margin-left: 25px; }
	/*#wrap ul.dl-btn li:last-child { float: right; }*/
	#wrap ul.dl-btn li p { font-size: 20px; }
	
	#wrap ul.sns li { margin: 0 27px; }
	#wrap ul.sns li img { height: 42px; }
	
	#footer { width: 100%; position: relative; padding: 20px 0; color: #ccc; text-align: center; }
	#footer p.copyright { font-size: 14px; line-height: 1.5;}
	#footer p.info { font-size: 11px; line-height: 1.5;}
	
	/*contents*/
	#wrap .gpBox { margin: 0 auto 42px; width: 658px; }
	#wrap .gpBox img { width: auto; }
	#wrap .gpBox h3 { margin-bottom: 30px; }
	#wrap .gpBox p { margin-left: 10px; font-size: 22px;  }
	
	#wrap div#part3 { margin-bottom: 98px; }
	/*#wrap div#part3 ul { text-align: center; margin: 0; width: 100%; overflow-x: visible;  }
	#wrap div#part3 ul li { margin: 0 16px; width: 288px;  }*/
	#wrap div#part3 ul.slider02 li p:before { width: 285px; height: 450px; border: solid 4px #eddba7; -moz-border-radius: 24px; -webkit-border-radius: 24px; border-radius: 24px; }
	#wrap div#part3 ul.slider02 li img{ padding-top: 40px; width: 282px; }
	
	#wrap div#part4,#wrap div#part5 { margin-bottom: 98px; width: 844px; }
	#wrap div ul.slider01 li p img { width: 362px; margin: 0 30px; }
	
	#wrap div#part6 div.banner  { width: 610px; }
	
}
@media screen and (min-width: 995px) { 
	body { background: url(http://honeymagazine.net/fr/img/bg_vr2_pc_fr.jpg) no-repeat center 30px; }
	
	/*1st Anv*/
	#wrap h1 p {  bottom: 2px;}
}