@charset "utf-8";

html {
  font-size: 62.5%;/* 16px x 0.625 = 10px(=1rem) */
  box-sizing: border-box;
}

body {
  color: #363636;
  position: relative;
  -webkit-font-feature-settings : "palt";
  font-feature-settings : "palt";
  background: #fff;
  font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  line-height: 0;
}

#main {
    width: 100%;
    margin: 0 auto;
    height: 100%;
    font-size: 4.062vw;
    line-height: 1.2em;
}

img {
	max-width: 100%;
	-webkit-backface-visibility: hidden;
}

a {color: #ff6000;}
a:hover {text-decoration: none;}

.sp{
	display:none;
}

/* --------ページトップ-------- */
#pageTop {  
  bottom: 18px;
  font-size: 130%;
  position: fixed;
  right: 20px;
  z-index:100;
} 
#pageTop a {
  background: url(../images/page-top.png) 0 0 no-repeat;
  height: 2em;
  background-size: contain;
  display: block;
  width: 2em;
  opacity: 0.8;
}



/* ===========================header================================ */
header {
  background-color: #f2f2f2; 
  /*border-bottom: #BBBDC5 1px solid;*/
  width: 100%;
}
ul.sns-btn {
  display: -webkit-box;/* Android 2～4 */
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  width: 93%;
  margin: 0 auto;
  min-height:40px;
}
ul.sns-btn a:hover {
  opacity: 0.6;
  transition: opacity 0.6s linear;
  -moz-transition: opacity 0.6s linear;
  -ms-transition: opacity 0.6s linear;
  -o-transition: opacity 0.6s linear;
  -webkit-transition: opacity 0.6s linear;
}
ul.sns-btn li {margin: 0 0 0 1em;}
ul.sns-btn li:first-child {margin-right: auto; margin-left: 0;}
ul.sns-btn li:nth-child(2) {margin-left:6%;}
ul.sns-btn li a img {min-width: 25px;}
ul.sns-btn li:first-child a img {width: 90%;}


/* ====================mainvisual==================== */
.mainvisual {
    background: url(../images/main-image.jpg) center center no-repeat;
    padding-top: 43.6%;
    background-size: 130%;
    width: 100%;
    max-width: 1400px;
    overflow: hidden;
    position: relative;
    margin: 0 auto 0.5em auto;
    display: block;
}
.mainvisual p{
	display: none;
}

/* ====================contents==================== */

.contents{
  width: 93%;
  margin: 0 auto;
  max-width: 1000px;
	overflow:hidden;
}

.contents h2 {
  color: #fff;
  font-family: 游明朝, YuMincho, serif;
  background-color: #00BDD8;
  display: block;
  line-height: 2;
  text-align:center;
}
.contents h2,
.contents h2.small {
  font-size: 130%;
}

.contBlock {
	overflow: hidden;
	margin-bottom: 2rem;  
}
.contBlock p{
  margin-bottom: 3rem;
  line-height:1.6;
}
.contBlock p.lead {
  margin-bottom: 0;
  font-weight: bold;
}
/* Andoroid */
html.android .contents br {display: none;}

.contBox{
	margin-bottom: 50px;
 }
.contWrap.row-2.entry .contBox{
	margin-bottom: 20px;
 }

p.title {
  color: #000;
  text-align: center;
  font-weight: bold;
  margin-bottom: 1rem;
  line-height: 2;
  background: -moz-linear-gradient(top left, #f9f0a0, #a67d33);
  background: -webkit-linear-gradient(top left, #f6e197, #c79e6a);
  background: linear-gradient(to bottom right, #f6e197, #c79e6a);
}
p.text_cp{
  line-height: 1.6
}
p.visuals{
	text-align:center;
	margin: 30px 0;
}
ul.detail{
  margin-bottom:3rem;
}
ul.detail li {
margin: 0 0 0 1em;
list-style: disc;
line-height: 1.6;  
}
.cvBtn {
	text-align: center;
	margin: 5rem auto 0;
}
.font_s {
	font-size: 2rem;
  line-height:1.6;
}
.font_s a{
	padding-left: 4rem;
}
.font_red{
	color:#FF0000;
}

/* pairTable */
table.pairTable{
	width: 100%;
	margin:40px auto;
}
table.pairTable th {
	padding: 1rem;
	text-align: center;

}
table.pairTable td{
	padding: 1rem 3rem 1rem 1rem;
}
table.pairTable tr th{
	background:#ccc;
}
/*table.pairTable tr th:nth-child(2){
	background:#349cff;
	color: #fff;
}*/

table.pairTable tr th,
table.pairTable tr td{
	border: 1px #000 solid;
}
table.pairTable tr th{
	padding: 10px;	
}
span.block_01 {
    padding-right: 6.7rem;
}

span.block_02 {
    padding-right: 4.5rem;
}

span.block_03 {
    padding-right: 3rem;
}

/* entryTable */
table.entryTable{
	width:98%;
	margin:10px auto;
}
table.entryTable tr th{
	width:50%;
	vertical-align:top;
	padding:10px;
	border-left: none;    
}


span.underline {
	border-bottom:1px solid #000e;
}

.linkNext {
	margin: 1em auto 1em;
}

.linkNext:hover{
	opacity:0.6;
}	

span.coupon {
	background-color: #00BDD8;
	display: inline-block;
	max-width: 660px;
	width: 100%;
	color: #fdff02;
	font-size: 3.8vw;
	font-weight: bold;
	line-height:2;
}

.notice{
	color: #ff6000;
	font-size: 2rem;
	padding: 1rem 2rem;
	background: #fff;
	border-radius: 25px;
	text-align: center;
	margin: 0 0 0 3rem;
	vertical-align: middle;
	line-height: 2;
	position: relative;
	top: -3px;
}	

/**fancy box(JQuery)**/
ul.gift_box {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
ul.gift_box li{
  width: 31%;
  margin-bottom: 3.5%;
}

.step {
  overflow: hidden;
  margin: 1.5rem 0;
  font-weight: bold;
  font-size: 2.2vw;
}
.step-waku  {
  position: relative;
  background: #0048aa;
  padding: 0.2em 0.4em;
  text-align: center;
  color: #fff;
  font-weight: bold;
  display: inline-block;
  line-height: 2.3;
  font-size: 1.75vw;
}
.step-waku:after {
  border-left: 2vw solid #0048aa;
  border-top: 2.4vw solid transparent;
  border-bottom: 2.4vw solid transparent;
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  margin-left: 50%;
}
.step-text{
  font-weight: bold;
  margin-left: 2.5vw;
  line-height: 1.5;
  display: inline;
}
.font-big {
  font-size: 2.2vw;
  font-weight: bold;
  margin-left: 10vw;
}
.font-big span {
  font-size: 1.8em;
  color: orange;
  font-weight: inherit;
}
.mb-2{
  margin-bottom:2rem;
}
.ml-13{
  margin-left: 13vw;
}
.ml-10{
  margin-left: 10vw;
}

@media screen and (min-width : 768px) { /* デスクトップ */
.contWrap{
	display: flex;
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	overflow: hidden;
}

.contents h2 {
  font-size: 2.0vw;
}  
.text_s{
	font-size: 1.2vw;
	text-align: left;
	line-height: 1.4;
	margin-bottom: 1em;
}

}/* //デスクトップ */

@media screen and ( max-width:599px ){
.step {font-size: 4vw;}
.font-big {
font-size: 4.2vw;
margin-left: 0;
}

.ml-15 {
  margin-left: 0;
}
.step-text {margin-left: 4.5vw;}
}
@media screen and ( max-width:395px ){
.step-waku:after {
border-left: 2.5vw solid #0048aa;
border-top: 2.72vw solid transparent;
border-bottom: 2.72vw solid 
}

}
@media screen and ( max-width:320px ){
.step-waku:after {
border-left: 3vw solid #0048aa;
border-top: 3.2vw solid transparent;
border-bottom: 3.2vw solid 
}

}

@media screen and ( max-width:599px ){

.pc{
	display:none;
}
.sp{
	display:block;
}
p{
	line-height: 1.4;
}

.cvBtn {
	margin: 2rem auto 0;
}
.notice {
	font-size: 1rem;
	padding: 0.5rem 1rem;
	margin: 0 0 0 3rem;
	line-height: 1;
	position: relative;
	top: -1px;
}
span.block_01,
span.block_02,
span.block_03 {
	padding-right: 0;
	display:inline-block;
}

span.block {
	display:inline-block;
}
table.entryTable {
    width: 100%;
		margin: 10px auto 15px;
		font-size: 1.4rem;
}
ul.detail li {
    margin: 0 0 0 2rem;
}
.font_s {
    font-size: 0.9em;
    line-height: 1.4;
}
}

/* ====================devices==================== */
@media screen and ( max-width:374px ){
  .contents br {display: none;}
}

@media screen and ( min-width:500px ){
  #main {font-size: 3.98vw;} 
  .mainvisualText {top: 2.8em;}
}

@media screen and ( min-width:600px ){
#main {font-size: 4vw;} 
#pageTop a {width: 58px;}
ul.sns-btn li {margin: 0 0 0 1.7em;}
.mainvisualText {top: 2.8em;}
}
@media screen and ( min-width:700px ){
#main {font-size: 2.0vw;}
#main .contBlock {font-size: 2.0vw;}
#main .contBlock .title {font-size: 3.0vw;}
span.coupon {font-size: 3.0vw;}
}

@media screen and ( min-width:815px ){
ul.sns-btn li:first-child a img {width: 90%;}

}

@media screen and ( min-width:900px ){
#main {font-size: 34px;}

}

@media screen and ( min-width:1000px ){
ul.sns-btn li {margin: 0 0 0 2.5em;}

.contBlock {max-width: 1000px; margin: 0 auto 60px;}

}

@media screen and ( min-width:1200px ){
ul.sns-btn {width: 1000px;}

}