@charset "UTF-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);

/* CS S Document */
#contents { background:url(../img/bg.jpg) repeat top center; position:relative; padding:0; }
.contents_inner { margin: 0 auto !important; padding: 0 0 60px; font-family: 'Noto Sans JP'; min-width:1024px; max-width:1200px; }
.contents_inner .btn { margin: 60px 0 0 }

.b-tit { position:relative; text-align:left; padding:90px 0 0; z-index:4; }
.b-tit .num { position:absolute; top:50px; left:65px; z-index:1; }
.b-tit .txt { padding:0 0 0 310px; }
.b-tit .kazari01 { position:absolute; top:-75px; right:-20px; z-index:3; }
.b-tit .tit_img { position:absolute; top:-25px; left:50%; z-index:2; margin:0 0 0 -194px; }
.b-tit .intro { font-size:14px; color:#906f2d; letter-spacing:0.3em; margin:30px 0 0; }


.letter_box { position:relative; }
.letter_box_top { background:#e8e8e8; transform:rotate(0.2deg); margin:0 0 0 0; box-shadow:0px 0px 1px 1px #eee; }
.letter_box_top .tit { margin:0 25px; background:url(../img/line.png) repeat-x bottom; }
.letter_box_top .txt { margin:0 25px; background:url(../img/line.png) repeat-x bottom; }
.letter_num { color:#f59898; font-size:24px !important; letter-spacing:0.2em; margin:0 0 5px; position:relative; z-index:3; font-family: 'GreycliffCF-Bold'; }
.letter_num span { font-size:16px !important; font-weight:100; font-style:italic; text-decoration:underline; font-family: 'GreycliffCF-Light'; }
.letter_name { color:#373737; font-size:18px; font-weight:600; line-height:1.6em; letter-spacing:0.3em; }
.letter_name span { color:#4ca0eb; font-size:14px; letter-spacing:0.2em; font-family: 'GreycliffCF-Light'; }


.campaign .letter_box { width:940px; margin:130px auto 100px; }
.campaign .letter_box_top { width:810px; margin:0 0 0 100px; }
.campaign .letter_box_img { position:absolute; top:-100px; left:0; }
.campaign .letter_box_top .tit h4 { color:#906f2d; font-size:15px; letter-spacing:0.3em; padding:35px 20px; }
.campaign .letter_box_top p { font-size:15px; padding:30px 0; letter-spacing:0.2em; }
.campaign .letter_box_top span { color:#b63232; }
.campaign .letter_box_bottom { background:#f1f1f1; position:relative; }
.campaign .letter_box_bottom img { padding:50px 0; }


.letter_list .tit { position:relative; margin:0 0 60px; }
.letter_list h4 { color:#da2838; font-size:28px; letter-spacing:0.3em; position:relative; z-index:2; font-family: 'GreycliffCF-Regular'; }
.letter_list h4 span { color:#906f2d; font-size:36px; font-family: 'GreycliffCF-Bold'; }
.letter_list .u_line { width:330px; height:10px; background:#fad6d7; position:absolute; bottom:15px; left:50%; margin:0 0 0 -170px; z-index:1; }
.letter_list ul li { width:33.333%;  float:left; text-align:left; margin:0 0 55px; position:relative; }
.letter_list ul li img { float:left; margin:0 18px 0 0; }
.letter_list .kazari02 { position:absolute; top:-2px; left:125px; z-index:1; }
.letter_list .pic { position:relative; z-index:2; }
.letter_list ul li a { text-decoration:none; }


.letter_detail .letter_box { width:1030px; margin:130px auto 100px; }
.letter_detail .letter_box_top { width:905px; margin:0 0 0 70px; }
.letter_detail .letter_box_img { position:absolute; top:-115px; left:0; }
.letter_detail .letter_box_top .pic { position:absolute; top:-25px; left:-50px; }
.letter_detail .letter_box_top .letter_num { position:absolute; top:-30px; right:0px; margin:0; }
.letter_detail .letter_box_top .tit { position:relative; }
.letter_detail .letter_box_top .tit h4 { text-align:left; padding:30px 0 30px 120px;  }
.letter_detail .letter_box_top p { font-size:15px; text-align:left; letter-spacing:0.2em; padding:50px 0 55px 120px; }
.letter_detail .letter_box_bottom { background:#f1f1f1; padding:0 0 300px; position:relative; }
.letter_detail .letter_box_bottom .a { font-size:14px; letter-spacing:0.2em; padding:0 40px 50px 20px; }
.letter_detail .letter_box_bottom .tw_pic { padding:75px 90px 0; }
.letter_detail .letter_box_bottom .tw_pic ul { padding:0 !important; margin:0 0 0 -75px; }
.letter_detail .letter_box_bottom .tw_pic ul li { width:50%; float:left; margin:0 0 75px; }
.letter_detail .letter_box_bottom .tw_pic ul li .inner { margin:0 0 0 75px; }
.letter_detail .letter_box_bottom .kazari03 { position:absolute; bottom:-25px; left:30px; }
.letter_detail .letter_box_bottom .ht { height:180px; }


.btn_p_n { margin: 60px 0 0 0; padding-top: 30px; background:url(../img/dots.png) repeat-x left top; }
.btn_prev a { color:#4e453b; font-weight:bold; float:left; position:relative; }
.btn_next a { color:#4e453b; font-weight:bold; float:right; position:relative; }
.btn_prev .ar { position:absolute; top:50%; left:0; margin:-21px 0 0 0; }
.btn_next .ar { position:absolute; top:50%; right:0; margin:-21px 0 0 0; }
.btn_prev p { padding:0 0 0 55px; }
.btn_next p { padding:0 55px 0 0; }


.btn-back { background:#f1eee8; padding:60px 0; }
.btn-back .btn-inner { margin: 0 auto; min-width:1024px; max-width:1200px; }
.btn-back a { font-size:16px; letter-spacing:0.2em; color:#452a19; text-decoration:none; padding:15px 0; background:#fff; border:4px solid #b63232; display:block; text-align:center; position:relative; min-width:1024px; max-width:1280px; margin:0 auto; display: block }
.btn-back a:hover { background: #b63232; color: #fff }
.ar01 { position:absolute; top:50%; left:50%; margin:-8px 0 0 -105px; }


.pc_none { display:none; }
.sp_none { display:block; }

.none { display:block; }

@media screen and (max-width: 980px) {
.letter_detail .letter_box_bottom { padding:0 0 280px; }	
.letter_detail .letter_box_bottom .ht { height:130px; }
}


@media screen and (max-width: 780px) {
/*#main img { width:150%; }*/

.contents_inner { margin:　60px auto 0 !important; padding: 0 0 30px  !important; min-width: inherit; max-width: inherit; }
.contents_inner .btn { margin: 30px 0 0 }
.contents_inner .btn img { width: 90%; height: auto }

.b-tit { padding: 30px 10px 0; }
.b-tit .num { position: relative; top: inherit; left: inherit; height: 80px; margin-bottom: 10px }
.b-tit .txt { padding:0 10px; width: auto }
.b-tit .txt img { width: 100% }
.b-tit .intro { font-size:14px; margin:15px 0 0; }
.b-tit .kazari01 { position:absolute; top:50px; right:10px; height:65px; } 
.b-tit .tit_img { margin:0 0 0 -154px; height:60px;  }


.letter_box_top { transform:rotate(0deg); margin:0; }
.letter_box_top .tit { margin:0 20px; }
.letter_box_top .txt { margin:0 20px; }
.letter_num { font-size:16px !important; }
.letter_num span { font-size:11px !important; }
.letter_name { font-size:14px; line-height:1.4em; }
.letter_name span { font-size:11px; }


.campaign .letter_box { width:auto; margin:100px 20px 50px; }
.campaign .letter_box_img { top:-60px; left:-50px; height:300px; }
.campaign .letter_box_top { width:auto; margin:0; }
.campaign .letter_box_top .tit h4 { font-size:15px; padding:15px 10px; }
.campaign .letter_box_top p { font-size:13px; padding:20px 0 25px; text-align:left; }
.campaign .letter_box_bottom img { padding:20px 0; width:100%; }


.letter_list { padding:0 20px; }
.letter_list .tit { position:relative; margin:0 0 30px; }
.letter_list h4 { font-size:22px; }
.letter_list h4 span { font-size:30px; }
.letter_list .u_line { width:280px; bottom:10px; left:50%; margin:0 0 0 -140px; }
.letter_list ul li { width:100%; margin:0 0 20px; }
.letter_list ul li img { margin:0 10px 0 0; }
.letter_list .kazari02 { top:0; left:75px; height:30px; }
.letter_list .pic { height:100px; }


.letter_detail .letter_box { width:auto; margin:100px 20px 30px; }
.letter_detail .letter_box_img { top:-60px; left:-50px; height:300px; }
.letter_detail .letter_box_top { width:auto; margin:0; }
.letter_detail .letter_box_top .pic { top:-20px; left:-30px; height:100px; }
.letter_detail .letter_box_top .letter_num { position:absolute; top:-15px; right:0; }
.letter_detail .letter_box_top .tit h4 { padding:35px 0 35px 80px;  }
.letter_detail .letter_box_top p { font-size:13px; padding:20px 0 25px 0; }
.letter_detail .letter_box_bottom { padding:0 0 180px; }
.letter_detail .letter_box_bottom .tw_pic { padding:40px 40px 0; }
.letter_detail .letter_box_bottom .tw_pic ul { padding:0 !important; margin:0; }
.letter_detail .letter_box_bottom .tw_pic ul li { width:100%; float:left; margin:0 0 40px; }
.letter_detail .letter_box_bottom .tw_pic ul li .inner { margin:0; }
.letter_detail .letter_box_bottom .kazari03 { position:absolute; bottom:-15px; left:-20px; width:100%; height:auto;  }
.letter_detail .letter_box_bottom .ht { height:30px; }


.btn_p_n { margin:0 20px; }
.btn_prev .ar { margin:-20px 0 0 0; width:36px; }
.btn_next .ar { margin:-20px 0 0 0; width:36px; }
.btn_prev p { padding:0 0 0 45px; font-size:12px; }
.btn_next p { padding:0 45px 0 0; font-size:12px; }


.btn-back { padding: 30px 20px; }
.btn-back a { font-size:14px; padding:15px 0; min-width:inherit; max-width:inherit; }
.ar01 { position:absolute; top:50%; left:50%; margin:-8px 0 0 -95px; }


.pc_none { display:block; }	
.sp_none { display:none; }	

.none { display:none; }
}


@media screen and (max-width: 320px) {
.b-tit { padding: 40px 10px 0; }	
.campaign .letter_box { width:auto; margin:70px 20px 30px; }
.campaign .letter_box_img { top:-60px; left:-50px; height:260px; }
.letter_detail .letter_box { width:auto; margin:70px 20px 30px; }
.letter_detail .letter_box_img { top:-60px; left:-50px; height:260px; }
.letter_detail .letter_box_bottom { padding:0 0 140px; }	
.letter_detail .letter_box_bottom .ht { height:40px; }
}