@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;
}

#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;}
a img:hover {
  opacity: 0.7;
}

/* --------ページトップ-------- */
#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;
}
.sp-block{
	display:none;
}

/* ===========================header================================ */
header {
  background-color: #f2f2f2;
  border-bottom: #BBBDC5 1px solid;
  width:100%;
  margin:0 auto;
  /* display: flex; */
}

ul.top_btn{
	max-width: 1000px;
	width: 100%;
	display: flex;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	width: 93%;
	margin: 0 auto;
	padding: 5px 0;
}
ul.top_btn li:first-child a img {
	max-width: 288px;
	width: 100%;
	display:block;
}
ul.top_btn li:nth-child(2) a img {
	display:block;
	max-width: 400px;
	width: 100%;
}

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

.contents{
  width:93%;
  margin: 30px auto 30px;
  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: 4em;
}

/* Andoroid */
html.android .contents br {display: none;}

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

.contents p.title {
	background-color: #183889;
	color: #FFF;
	text-align: center;
	font-weight: bold;
	margin-bottom: 1rem;
	/* line-height: 2; */
	padding: 1rem 0;
}
p.lead {
	margin-top: 1em;
}
p.visuals{
	text-align:center;
	margin: 30px 0;
}

ul.detail {
    padding-left: 1rem;
}
ul.detail li{
    margin-left: 2rem;
		line-height:1.6;
		list-style:disc;
}

ul.detail_2 li {
	margin: 10px 0 0 1em;
	text-indent: -1em;
	list-style:none;
}
ul.detail_2.center {
	text-align: center;
}
ul.detail_2.center.date li{
	text-indent: 0;
	font-size:2rem;
	line-height:1.2;
	margin: 2rem 0;
	text-align:left;
}
.cvBtn {
	text-align: center;
	margin: 2rem auto 0;
}

.font_s {
	font-size: 1.8rem;
	line-height:1.6;
  margin-top: 1rem;  
}
.font_s a{
	padding-left: 2rem;
}
.font_red{
	color:#FF0000;
}

.flex {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 40px auto 0;
}
.flex.border {
  border-bottom: 1px dotted #ccc;
}
.profile {
  width: 25%;
}
.profile_text {
  width: 70%;
}
.profile_text p{
  font-size: 2rem;
  line-height: 1.6;
}
#notice p{
  font-size: 2rem;
  line-height: 1.6;
  margin-bottom:2rem;
}
#notice p.notice_txt {
    margin-left: 1.6rem;
    text-indent: -1.6rem;
    margin-bottom: 0;
}
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; */
}
.group {
    margin: 40px auto;
}

@media screen and (min-width : 768px) { /* デスクトップ */
.contWrap{
	display: flex;
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	overflow: hidden;
}
.contWrap.row-2 .contBox{
	width: 50%;
	margin: 0 auto 50px;
}
.contWrap.row-2.first {
	width: 100%;
} 
.contWrap.row-2.small {
	width: 66%;
}
.contWrap.row-2 .contBox.left{
	margin-right: 4%;
}
.contWrap.row-2 .contBox.left.small {
	margin-right: 3%;
}  
.contWrap.row-3 .contBox{
	width: 32%;
}

.contBox.right.small,
.contBox.left.small{
	width: 320px;
}
.contWrap.row-3 .contBox.center{
   margin-right: 2%;
   margin-left: 2%;
}
.contents h2 {
  font-size: 2.0vw;
}  
.contents h2.small {
  font-size: 2.0vw;
}
.contWrap.row-2.entry {
	width:94%;
}
.contWrap.row-2.entry p {
	font-size: 68%;
}
.sp_only{
	display:none;
}
.text_s{
	font-size: 1.2vw;
	text-align: left;
	line-height: 1.4;
	margin-bottom: 1em;
}
ul.detail_2.center.date{
	margin: 3rem 0;
}
ul.detail_2.center.date li{
	text-align:center;
	font-size: 3rem;
}

}



/* =======================　599px以下　======================== */
@media screen and ( max-width:599px ){
.contents {
	width: 93%;
	margin: 0 auto 30px;
}
.contents p{
	line-height:1.6;
}
.profile_text p{
  font-size:1.5rem;
}
#notice p{
  font-size:1.5rem;
}
.pc-block{
	display:none;
}
.sp-block{
	display:block;
}
.font_s{
	font-size:1.0rem;
	line-height:1.4;
}
.notice {
    font-size: 1rem;
    padding: 0.5rem 1rem;
    margin: 0 0 0 3rem;
    line-height: 1;
    position: relative;
    top: -1px;
}
.group {
    margin: 20px auto;
}
.contBlock {
    margin-bottom: 20px;
}
ul.top_btn li {
    width: 100%;
    margin: 0 auto;
}

ul.top_btn li:nth-child(2) a img {
    margin: 0 auto 10px;
}

.flex {
    margin: 20px auto;
    padding-bottom: 20px;
}

ul.detail {
    padding-left: 0rem;
}
ul.detail li{
    margin-left: 2rem;
}

}
/* ====================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.top-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.top-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.top-btn li {margin: 0 0 0 2.5em;}

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

.mainvisual {
    width: 100%;
    height: 474px;
    background-position: center top;
    padding-top: 0;
    background-size: auto;
}
}

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

}