@charset "utf-8";
/* CSS Document */

/* 
===================== 1.Universal reset ==========================
*/
.pc { display: block !important; }
.sp { display: none !important; }
/*--- スマホ・タブレット ---*/
@media screen and (max-width:768px){
    .pc { display: none !important; }
    .sp { display: block !important; }
}

img{
	border: none;
	margin: 0 auto 0;
	padding: 0;
	height:auto;
	}
.clear{
	clear: both;
	}
span {
   display: inline-block;
	}
	
/* 
===================== 2.Body and base setting ====================
*/
body{
	font-family: 'M PLUS Rounded 1c',"メイリオ", Meiryo, Osaka,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: 900;
    background-color:#fff;
	color: #663300;
	margin: 0;
	padding: 0;
	}


#wrap {
	width:100%;
	margin: 0 auto;
	padding: 0;
	}
#copyright{
	width: 100%;
	text-align:center;
	margin: 0 auto;
	padding:10px 0;
	}
a:hover img{
opacity:0.8;
filter:alpha(opacity=80);
-ms-filter: “alpha( opacity=80 )”;
	}



/* 
===================== 3.Content setting ====================
*/
#top{
    background: #FCC10B;
    margin: 0 auto;
    padding: 0 0 40px 0;
    text-align: center;
}
#top h1{
    line-height:0;
    margin: 0;
    padding: 0;
}
#top h1 img{
    width:100%;
    max-width: 705px;
}


#logo{
    margin: 0 auto;
    text-align: center;
}
#logo img{
    width:50%;
    max-width: 250px;
    margin: 15px 0;
}




/*--- menu ---*/

/*
.h100{
  height: 100px;
}
*/

.menubox{
	width: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	}
/*
*, *:before, *:after {
box-sizing: border-box;
	}
*/

.menu-bg{
    background: linear-gradient(180deg, #FCC10B 0%, #FCC10B 50%, #F9D2E4 50%, #F9D2E4 100%);
    display: flex;
    justify-content: center;
}
@media screen and (max-width: 480px) {
    .menu-bg{background: linear-gradient(180deg, #FCC10B 0%, #FCC10B 75%, #F9D2E4 75%, #F9D2E4 100%);}
}
.menu-width{
    width: 90%;
    max-width: 950px;
    margin: 0 auto;
    text-align: center;
}

#menu{   
	width: 100%;
	display: flex;
	display: -ms-flexbox;
	flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	justify-content: center;
	}
#menu > div{
	width: 16%;
	margin:  0 2%;
	text-align: center;
	}
#menu img{
	width: 100%;
    max-width: 140px;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	}
#menu a:hover {
	text-decoration:none;
	}
#menu a:hover img{
	opacity:0.8;
	filter:alpha(opacity=60);
	-ms-filter: “alpha( opacity=60 )”;
	transform: translateY(10px);
	}

@media screen and (max-width: 960px) {
.menubox{
	width: 100%;	
	}
/*#menu > div{
	width: 30%;
	margin: 1% 5%;
	}
#menu img{
	border: 1% solid #fff;
	}	*/
}
@media screen and (max-width: 480px) {
.menubox{
	width: 100%;	
	margin: 0 auto;
	}	
#menu > div{
	width: 28%;
	margin: 1%;
	}
/*#menu img{
	border: 1% solid #fff;
	}	*/
}





.bg-1{background: #F9D2E4;}
.bg-2{background: #F4AACB;}


h2{
    color: #663300;/*#E6001A*/
    font-size: 2em;
    line-height: 0;
    margin: 0 auto 25px auto;
    padding: 0;
    text-align: center;
    text-shadow:0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff;
}
@media screen and (max-width: 480px) { h2{font-size: 1.6em;} }
h2 span{
    font-size: 80%;
}


.answer{
    background: #FFF;
    border-radius: 50px;
    width: 80%;
    max-width: 607px;
    padding: 2em 0.5em 0.5em 0.5em;
    margin: 0 auto 30px auto;
    position: relative;
  display: inline-block;
}
.answer:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #FFF;
}

.contents_wrap1, .contents_wrap2{
    margin: 0 auto;
    padding: 120px 0;
    text-align: center;
}
@media screen and (max-width: 480px) {
    .contents_wrap1, .contents_wrap2{padding: 70px 0;}
}
.contents_wrap1 img{
    border: 10px solid #FFF;
    width: 90%;
    max-width: 640px;
}
.contents_wrap2 img{
    border: 10px solid #FFF;
    width: 90%;
    max-width: 1095px;
}



/*--- キャンペーンTOPへ戻る ---*/	
.back_cpn {
	width:95%;
    padding: 30px 0;
    margin: 80px auto 90px;
    color:#630;
    background: #ffeaea;
    box-shadow: 0px 0px 0px 10px #ffeaea;
    border: dashed 2px #ffc3c3;
    border-radius: 5px;
	}
.back_cpn p {
    margin: 0; 
    padding: 0;
	font-weight:bold;
	font-size: 20px;
	text-align:center;
	}
.back_cpn a {text-decoration: none; }
.back_cpn a:link { color: #cd5c5c; }
.back_cpn a:visited { color: #cd5c5c; }
.back_cpn a:hover { color: #f08080; }
.back_cpn a:active { color: #f08080; }


/*--- bnr ---*/
#box_bnr{
	width:100%;
	margin: 50px auto;
	padding:0;
	text-align:center;
	}
#box_bnr img{
    width:90%;
    max-width: 580px;
	padding-bottom:15px;
	}

/*---------SNS--------*/	
#sns_box{
	width:100%;
	margin:  0 auto;
	padding:20px 0 ;
	text-align:center;
	background-color: #FFF;   /* 背景色 */
	}
#btn_box img{
	float:none;
	margin: 0 auto;
	padding:15px;
	/*width:50px;*/
	}
#btn_box{
	width:100%;
	text-align:center;
	margin:0 auto;
	padding: 0 auto;
	}

/*---------page-top--------*/	
#page_top{
  width: 80px;
  height: 80px;
  position: fixed;
  right: 1em;
  bottom: 15px;
  background: #ef3f98;
  opacity: 0.7;
  border-radius: 50%;
}
#page_top a{
  position: relative;
  display: block;
  width: 80px;
  height: 80px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 40px;
  color: #fff;
  position: absolute;
  width: 30px;
  height: 30px;
  top: -15px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}


/*===============================================
スマホ・タブレット
===============================================*/
@media screen and (max-width:768px){


/* 
===================== 3.Content setting ====================
*/
/*--- Contents ---*/
.contents_box{
	width:95%;
	}
.contents_box img{
	width:92%;
	}
	

	
/*--- キャンペーンTOPへ戻る ---*/	
.back_cpn {
	width:90%;
    padding: 40px 0;
    margin: 70px auto 60px;
    box-shadow: 0px 0px 0px 10px #ffeaea;
    border: dashed 5px #ffc3c3;
    border-radius: 5px;
	}
.back_cpn p {
	font-size: 30px;
	}
		
/*--- bnr ---*/
#box_bnr{
	width:95%;
	margin: 5% auto;
	padding:0;
	text-align:center;
	}
#box_bnr img{
	padding-bottom:15px;
	}

/*---------SNS--------*/	
#sns_box{
	width:100%;
	margin:  0 auto;
	padding:20px 0 50px 0;
	text-align:center;
	background-color: #FFF;   /* 背景色 */
	}
#btn_box{
	width:100%;
	text-align:center;
	margin:0 auto;
	padding: 0 ;
	}
#btn_box img{
	width:15%;
	float:none;
	margin: 0 auto;
	padding:1%;
	}
#copyright{
	font-size: 23px;
	}

} /* /@media */	