@charset "utf-8";

#contents{
	background:#f6cdae;
	font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", "sans-serif";
	color: #3a1300;
	text-align: center;
	padding: 0;
	font-size: 14px;
	line-height: 1.6;
}
#contents .inner {
	width: 100%;
}
#contents .att-area .att_ttl h3,h3,h4{
    font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";}

.display-sp {
	display: none;
}
.display-pc {
	display:block;
}
a {
	color: #0074ff;
	text-decoration: underline;
}
.b{
    font-weight: bold;}
.center{
    text-align: center;
}
.maT10{
    margin-top:10px;
}
.maB10{
    margin-bottom:10px;
}
.red{
    color: #FF0004;
}

/* ============== 終了文言 =================== */

.end_txt{
    padding:5px 0;
    font-weight: bold;
    color:#FF0004;
    font-size: 20px;
    background: #fff;
}

/* ============== 全体、box =================== */

.sec-box_a {
    background: #f6cdae;
    width: 94%;
    padding: 40px 3% 30px;
    margin: -18px 0 auto;
}
.sec-box_b {
    background: #fff6e6;
    width: 94%;
    margin:  0 auto;
    padding: 30px 3%;
}

.sec-box2{
    width: 94%;
    max-width: 870px;
    margin: 10px auto 0;
    padding: 20px 3% 20px;
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 15px;
}
.sec-box_a img,.sec-box_b img{
    max-width: 550px;
    width: 100%;
    margin: auto;
}

.redbox{
    border: 1px solid #ff0000;
    padding: 10px;
    margin: 20px 5px ;
    color: #ff0000;
    display: inline-block;
    background:#fff;
}

/* ============== MV =================== */
.mv{
    background:#ed9763;  
}
.mv img{
	margin: 0 auto;
}

/* =============タイトル================*/

.tit_txt{
    margin:0 auto ;
    text-align: center;
    background:#ef5459;
}
.tit_txt img {
    max-width: 590px;
    width: 100%;
    margin: auto;
}


/* ================= 注釈 ================= */

.tt-2 {
		margin: 10px 0 30px;
	}

.tt-2 h3{
  margin: 15px 7px 10px 7px;
	font-size: 20px;
    font-weight: 600;
    color: #664b4b;
    line-height: 1;
    padding: 0 8px;
    border-left: solid 8px #ff9c31;
}

.att-area {
	text-align: left;
}

.list-ind li {
    text-indent: -15px;
    padding-left: 15px;
    list-style: none;
}


/* =================ボタン(タブ内)================== */

.btn_area{
    background:#e58144;
    padding: 20px 0 10px;
}
.btn {
	max-width: 545px;
	width: 100%;
	margin: 0 auto ;
}
.btn_2 {
	max-width: 565px;
	width: 100%;
	margin: 0 auto ;
}
.btn,.btn_2 img{
	margin: auto;
}
.btn,.btn_2 a {
	width: 100%;
}

.btn_bottom{
    padding: 10px 0 20px;
    margin: 0 auto;
    display: inline-block;
    max-width: 95%;
}

/* =================appボタン(タブ内)================== */

ul.app {
    height: 100%;
}
.app_li {
    display: inline-block;
    vertical-align: middle;
    padding: 15px 0;
}
.app_li img {
    width: 80%;
    margin-top: 8px;
} 
.appDownload .app li {
	display: none;
    overflow: hidden;
}
.appDownload .app li.active {
	display: block;
}

/* ================= その他 ====================== */
.clearfix:after {
  content: ""; 
  display: block; 
  clear: both;
}

.container-wrap #pagetop {
    padding-top: 50px;
}

.fl-l {
	float: left;
}

.fl-r {
	float: right;
}
.mT10 {
	margin-top: 10px;
}
.mT20 {
	margin-top: 20px;
}

.mT25 {
	margin-top: 25px;
}

.mT30 {
	margin-top: 30px;
}


/* ============== タブレット調整用=============== */
@media only screen and (min-width:768px) and (max-width:1024px) {
    
.entry-step img{
    max-width: 100%;
    width: 22%;
}
}

/* ================= SP ====================== */

@media screen and (max-width: 767px) {
.display-pc {
		display: none;
}
.display-sp {
		display: block;
}
#contents {
		line-height: 1.5;
}
    
.sec-box {
		width: 94%;
		padding: 20px 4% ;
		margin: -30px auto ;
}
    
/* ========== MV ============= */
    
.mv img{
    padding: 0;
    max-width: 780px;
    width: 100%;
    margin: auto;
}
    
/* =================appボタン(タブ内)==================  */
    
.app_li{
    padding: 0px 0 10px;
	width: 239px;
    }
    
    .app_li img {
    width: 95%;
}
    
/* ========= タイトル ========== */   
.tit_txt{
    width: auto;
}  
.tit_txt h3{
    margin: 40px auto 20px;
    line-height: 1.5;
    font-size: 23px;
    padding: 0 5px;
} 
 .tit_txt02 h3{
     margin: 0;
}
h3 span:before {
    left: 1px;
}
    
h3 span:before, h3 span:after {
    top: 50%;
    -webkit-transform: translate(0,-50%);
    -moz-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    -o-transform: translate(0,-50%);
    transform: translate(0,-50%);
}
    
/* ============= 注釈 ============ */
.tt-2 {
		margin: 10px 0 30px;
	}
.container-wrap #pagetop{
		padding-top: 6%;
	}
    
.tit_txt{
     text-align: center;
     width: auto;
     
}

	/* =================ボタン(タブ内)================== */
.btn {
		margin: 0 auto ;
        width: 87%;
	}
.btn_2 {
        width: 87%;
    padding-top: 2%;
}
.btn_area {
     padding: 3% 0 3%;
}
    
/* =================SNS================== */

.sec-boxsns{
    padding: 5px 0 40px;
}
    
.sec-boxsns .sns{
    padding: 0 2px;
}
.sns_att{
    margin: 5px 0 0 ;
}
    
}
/* ================= SP ====================== */

@media screen and (max-width: 500px) {
/* =================appボタン(タブ内)================== */

.app_li{
    padding: 0px 0 10px;
	width: 155px;
    } 
}

