@charset "UTF-8";

/* ---------------------------------------------------------------------------
 TOPs
----------------------------------------------------------------------------- */
* {  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
html { width:100%; height:100%; overflow-x:hidden; overflow-y:auto; -webkit-text-size-adjust: 100%; -webkit-overflow-scrolling:touch; }
html { font-family: "游ゴシック","YuGothic", "Yu Gothic", "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "ＭＳ Ｐゴシック", "MS PGothic" !important; }
body { width:100%; height:100%; margin:0; padding:0; line-height:1.5; letter-spacing:1.5px; text-align:center; position:relative; }
article { width:100%; height:100%; margin:0; padding:0; color:#736240; position:relative; top:0; left:0; }
/* ---------------------------------------------------------------------------
LINK
----------------------------------------------------------------------------- */
a { -webkit-tap-highlight-color:rgba(0,0,0,0); }
a { font-style:normal; text-decoration:none; }
a:link { font-style:normal; text-decoration:none; }
a:visited { font-style:normal; text-decoration:none; }
a:hover { font-style:normal; text-decoration:none; }
a img { border: none; }
/* ---------------------------------------------------------------------------
Form
----------------------------------------------------------------------------- */
::-webkit-input-placeholder { color:#9B9D99; text-align:center; }
::-ms-input-placeholder { color:#9B9D99; text-align:center; }
::-moz-placeholder { color:#9B9D99; text-align:center; }
input:focus::-webkit-input-placeholder,isindex:focus::-webkit-input-placeholder,textarea:focus::-webkit-input-placeholder { color: transparent; }
textarea:focus::-webkit-input-placeholder,isindex:focus::-webkit-input-placeholder,textarea:focus::-webkit-input-placeholder { color: transparent; }
input,textarea { outline: none; }


/* ---------------------------------------------------------------------------
Contents
----------------------------------------------------------------------------- */
div.wrapper { width:95%; max-width:1200px; margin:0 auto 0 auto; overflow:hidden; }
section.main { width:75%; margin:120px 0 0 0; padding:0 0 0 0; float:left; }
div.page_title { width:100%; margin:0 0 0 0; padding:0 0 0 0; }
div.page_title h2 { margin:0 0 0 0; padding:0 0 0 0; color:#736240; font-family:'wbf'; font-size:110%; text-align:center; line-height:1em; letter-spacing:3px; }
div.page_navi { width:420px; margin:60px auto 0 auto; padding:0 0 0 0; overflow:hidden; }
div.page_navi p.btn_on { display:block; width:200px; margin:0 0 0 0; padding:10px 0 10px 0; border:1px solid #736240; float:left; font-family:'wbf'; font-size:120%; text-align:center; line-height:1em; letter-spacing:3px; }
div.page_navi p.btn_off { display:block; width:200px; margin:0 20px 0 0; border:1px solid #7CA694; float:left; font-family:'wbf'; font-size:120%; text-align:center; line-height:1em; letter-spacing:3px; }
div.page_navi p.btn_off a { display:block; width:100%; padding:10px 0 10px 0; color:#7CA694; cursor:pointer; }
div.page_navi p.btn_off a:hover { background:#7CA694; color:#ffffff; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -ms-transition:all 0.3s; transition:all 0.3s; }
div.manga { width:100%; max-width:680px; margin:40px auto 0 auto; padding:0 0 0 0; overflow:hidden; }
div.manga div.img_box { width:100%; margin:0 0 0 0; overflow:hidden; }
div.manga div.img_box div.banner { width:48%; margin:0 4% 20px 0; float:left; }
div.manga div.img_box div.banner:nth-child(even) { margin:0 0 20px 0; }
div.manga div.img_box div.banner a { display:block; }
div.manga div.img_box div.banner a:hover { opacity:0.6; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -ms-transition:all 0.3s; transition:all 0.3s; }
div.manga div.img_box div.banner a img { width:100%; height:auto; max-height:128px; }
div.attention { width:100%; max-width:680px; margin:200px auto 0 auto; padding:20px 20px 20px 20px; border:1px solid #7CA694; border-radius:20px; }
div.attention p.title { margin:0 0 0 0; color:#ED3E49; font-family:'wbf'; font-size:110%; text-align:center; letter-spacing:2px; }
div.attention p.detail { margin:10px 0 0 0; font-size:90%; text-align:center; line-height:2em; letter-spacing:1px; }
/*--Footer--*/
@media screen and (min-width:751px) {
footer { width:100%; margin:0 0 0 0; padding:200px 0 40px 0; overflow:hidden; }
}

/* ============================================================================
                Media Querys
=============================================================================== */
/* ------------------------------------------------------
300 - 350 （iphone 4）
-------------------------------------------------------- */
@media screen and (min-width: 300px ) and (max-width:350px) {
section.main { width:95%; margin:30px auto 0 auto; padding:0 0 0 0; float:none; }
div.page_navi { width:100%; margin:40px auto 0 auto; padding:0 0 0 0; overflow:hidden; }
div.page_navi p.btn_on { display:block; width:48%; margin:0 0 0 0; padding:7px 0 7px 0; border:1px solid #736240; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off { display:block; width:48%; margin:0 4% 0 0; border:1px solid #7CA694; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off a { display:block; width:100%; padding:7px 0 7px 0; color:#7CA694; cursor:pointer; }
div.manga div.img_box div.banner { width:100%; margin:0 0 20px 0; float:none; }
div.manga div.img_box div.banner a img { width:100%; height:auto; max-height:320px; }
div.attention { width:100%; max-width:none; margin:40px auto 0 auto; padding:10px 10px 10px 10px; border:1px solid #7CA694; border-radius:10px; }
div.attention p.detail { margin:10px 0 0 0; font-size:85%; text-align:left; line-height:2em; letter-spacing:0px; word-break:break-all; }
/* ------------------------------------------------------
300 - 350 （iphone 5）
-------------------------------------------------------- */
@media screen and (max-width: 350px) and (max-height: 568px) {
}
}


/* ------------------------------------------------------
350 - 400 ( android）（iphone6-375）
-------------------------------------------------------- */
@media screen and (min-width: 351px ) and (max-width:400px) {
section.main { width:95%; margin:30px auto 0 auto; padding:0 0 0 0; float:none; }
div.page_navi { width:100%; margin:40px auto 0 auto; padding:0 0 0 0; overflow:hidden; }
div.page_navi p.btn_on { display:block; width:48%; margin:0 0 0 0; padding:7px 0 7px 0; border:1px solid #736240; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off { display:block; width:48%; margin:0 4% 0 0; border:1px solid #7CA694; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off a { display:block; width:100%; padding:7px 0 7px 0; color:#7CA694; cursor:pointer; }
div.manga div.img_box div.banner { width:100%; margin:0 0 20px 0; float:none; }
div.manga div.img_box div.banner a img { width:100%; height:auto; max-height:320px; }
div.attention { width:100%; max-width:none; margin:40px auto 0 auto; padding:10px 10px 10px 10px; border:1px solid #7CA694; border-radius:10px; }
div.attention p.detail { margin:10px 0 0 0; font-size:85%; text-align:left; line-height:2em; letter-spacing:1px; word-break:break-all; }
}


/* ------------------------------------------------------
400 - 450（iphone6plus 414）
-------------------------------------------------------- */
@media screen and (min-width: 401px) and (max-width:450px) {
section.main { width:95%; margin:30px auto 0 auto; padding:0 0 0 0; float:none; }
div.page_navi { width:100%; margin:40px auto 0 auto; padding:0 0 0 0; overflow:hidden; }
div.page_navi p.btn_on { display:block; width:48%; margin:0 0 0 0; padding:7px 0 7px 0; border:1px solid #736240; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off { display:block; width:48%; margin:0 4% 0 0; border:1px solid #7CA694; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off a { display:block; width:100%; padding:7px 0 7px 0; color:#7CA694; cursor:pointer; }
div.manga div.img_box div.banner { width:100%; margin:0 0 20px 0; float:none; }
div.manga div.img_box div.banner a img { width:100%; height:auto; max-height:320px; }
div.attention { width:100%; max-width:none; margin:40px auto 0 auto; padding:10px 10px 10px 10px; border:1px solid #7CA694; border-radius:10px; }
div.attention p.detail { margin:10px 0 0 0; font-size:85%; text-align:left; line-height:2em; letter-spacing:1px; word-break:break-all; }
}


/* ------------------------------------------------------
450 - 500（iphone4 横）
-------------------------------------------------------- */
@media screen and (min-width: 451px) and (max-width:500px) {
section.main { width:95%; margin:30px auto 0 auto; padding:0 0 0 0; float:none; }
div.page_navi { width:100%; margin:40px auto 0 auto; padding:0 0 0 0; overflow:hidden; }
div.page_navi p.btn_on { display:block; width:48%; margin:0 0 0 0; padding:7px 0 7px 0; border:1px solid #736240; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off { display:block; width:48%; margin:0 4% 0 0; border:1px solid #7CA694; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off a { display:block; width:100%; padding:7px 0 7px 0; color:#7CA694; cursor:pointer; }
div.manga div.img_box div.banner { width:100%; margin:0 0 20px 0; float:none; }
div.manga div.img_box div.banner a img { width:100%; height:auto; max-height:320px; }
div.attention { width:100%; max-width:none; margin:40px auto 0 auto; padding:10px 10px 10px 10px; border:1px solid #7CA694; border-radius:10px; }
div.attention p.detail { margin:10px 0 0 0; font-size:90%; text-align:left; line-height:2em; letter-spacing:1px; word-break:break-all; }
/* ------------------------------------------------------
450 - 500（pc）
-------------------------------------------------------- */
@media screen and (max-width : 500px) and (min-height : 480px) {
}
}


/* ------------------------------------------------------
500 - 550 （ xperia z ultra）
-------------------------------------------------------- */
@media screen and (min-width: 501px) and (max-width:550px){
section.main { width:95%; margin:30px auto 0 auto; padding:0 0 0 0; float:none; }
div.page_navi { width:100%; margin:40px auto 0 auto; padding:0 0 0 0; overflow:hidden; }
div.page_navi p.btn_on { display:block; width:48%; margin:0 0 0 0; padding:7px 0 7px 0; border:1px solid #736240; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off { display:block; width:48%; margin:0 4% 0 0; border:1px solid #7CA694; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off a { display:block; width:100%; padding:7px 0 7px 0; color:#7CA694; cursor:pointer; }
div.manga div.img_box div.banner { width:100%; margin:0 0 20px 0; float:none; }
div.manga div.img_box div.banner a img { width:100%; height:auto; max-height:320px; }
div.attention { width:100%; max-width:none; margin:40px auto 0 auto; padding:10px 10px 10px 10px; border:1px solid #7CA694; border-radius:10px; }
div.attention p.detail { margin:10px 0 0 0; font-size:90%; text-align:left; line-height:2em; letter-spacing:1px; word-break:break-all; }
}


/* ------------------------------------------------------
550 - 600（iphone5 横）
-------------------------------------------------------- */
@media screen and (min-width: 551px) and (max-width:600px){
section.main { width:95%; margin:30px auto 0 auto; padding:0 0 0 0; float:none; }
div.page_navi { width:100%; margin:40px auto 0 auto; padding:0 0 0 0; overflow:hidden; }
div.page_navi p.btn_on { display:block; width:48%; margin:0 0 0 0; padding:7px 0 7px 0; border:1px solid #736240; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off { display:block; width:48%; margin:0 4% 0 0; border:1px solid #7CA694; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off a { display:block; width:100%; padding:7px 0 7px 0; color:#7CA694; cursor:pointer; }
div.manga div.img_box div.banner { width:100%; margin:0 0 20px 0; float:none; }
div.manga div.img_box div.banner a img { width:100%; height:auto; max-height:320px; }
div.attention { width:100%; max-width:none; margin:40px auto 0 auto; padding:10px 10px 10px 10px; border:1px solid #7CA694; border-radius:10px; }
div.attention p.detail { margin:10px 0 0 0; font-size:90%; text-align:left; line-height:2em; letter-spacing:1px; word-break:break-all; }
/* ------------------------------------------------------
550 - 600（pc）
-------------------------------------------------------- */
@media screen and (max-width : 600px) and (min-height : 350px) {
}
}


/* ------------------------------------------------------
600 - 650（android 横）
-------------------------------------------------------- */
@media screen and (min-width: 601px) and (max-width:650px){
section.main { width:95%; margin:30px auto 0 auto; padding:0 0 0 0; float:none; }
div.page_navi { width:100%; margin:40px auto 0 auto; padding:0 0 0 0; overflow:hidden; }
div.page_navi p.btn_on { display:block; width:48%; margin:0 0 0 0; padding:7px 0 7px 0; border:1px solid #736240; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off { display:block; width:48%; margin:0 4% 0 0; border:1px solid #7CA694; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off a { display:block; width:100%; padding:7px 0 7px 0; color:#7CA694; cursor:pointer; }
div.manga div.img_box div.banner { width:100%; margin:0 0 20px 0; float:none; }
div.manga div.img_box div.banner a img { width:100%; height:auto; max-height:320px; }
div.attention { width:100%; max-width:none; margin:40px auto 0 auto; padding:10px 10px 10px 10px; border:1px solid #7CA694; border-radius:10px; }
div.attention p.detail { margin:10px 0 0 0; font-size:90%; text-align:left; line-height:2em; letter-spacing:1px; word-break:break-all; }
/* ------------------------------------------------------
600 - 650（pc）
-------------------------------------------------------- */
@media screen and (max-width: 650px) and (min-height:420px){
}
}


/* ------------------------------------------------------
650 - 700（iphone6横=667）
-------------------------------------------------------- */
@media screen and (min-width: 651px) and (max-width:700px){
section.main { width:95%; margin:30px auto 0 auto; padding:0 0 0 0; float:none; }
div.page_navi { width:100%; margin:40px auto 0 auto; padding:0 0 0 0; overflow:hidden; }
div.page_navi p.btn_on { display:block; width:48%; margin:0 0 0 0; padding:7px 0 7px 0; border:1px solid #736240; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off { display:block; width:48%; margin:0 4% 0 0; border:1px solid #7CA694; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off a { display:block; width:100%; padding:7px 0 7px 0; color:#7CA694; cursor:pointer; }
div.manga div.img_box div.banner { width:100%; margin:0 0 20px 0; float:none; }
div.manga div.img_box div.banner a img { width:100%; height:auto; max-height:320px; }
div.attention { width:100%; max-width:none; margin:40px auto 0 auto; padding:10px 10px 10px 10px; border:1px solid #7CA694; border-radius:10px; }
div.attention p.detail { margin:10px 0 0 0; font-size:90%; text-align:left; line-height:2em; letter-spacing:1px; word-break:break-all; }
/* ------------------------------------------------------
650 - 700（pc）
-------------------------------------------------------- */
@media screen and (max-width: 700px) and (min-height:450px){
}
}


/* ------------------------------------------------------
700 - 750（iphone6plus横=736）
-------------------------------------------------------- */
@media screen and (min-width: 701px) and (max-width:750px){
section.main { width:95%; margin:30px auto 0 auto; padding:0 0 0 0; float:none; }
div.page_navi { width:100%; margin:40px auto 0 auto; padding:0 0 0 0; overflow:hidden; }
div.page_navi p.btn_on { display:block; width:48%; margin:0 0 0 0; padding:7px 0 7px 0; border:1px solid #736240; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off { display:block; width:48%; margin:0 4% 0 0; border:1px solid #7CA694; float:left; font-family:'wbf'; font-size:105%; text-align:center; line-height:1em; letter-spacing:2px; }
div.page_navi p.btn_off a { display:block; width:100%; padding:7px 0 7px 0; color:#7CA694; cursor:pointer; }
div.manga div.img_box div.banner { width:100%; margin:0 0 20px 0; float:none; }
div.manga div.img_box div.banner a img { width:100%; height:auto; max-height:320px; }
div.attention { width:100%; max-width:none; margin:40px auto 0 auto; padding:10px 10px 10px 10px; border:1px solid #7CA694; border-radius:10px; }
div.attention p.detail { margin:10px 0 0 0; font-size:90%; text-align:left; line-height:2em; letter-spacing:1px; word-break:break-all; }
/* ------------------------------------------------------
700 - 750（pc）
-------------------------------------------------------- */
@media screen and (max-width: 750px) and (min-height:450px){
}
}


/* ------------------------------------------------------
750 - 800（ ipad ）
-------------------------------------------------------- */
@media screen and (min-width: 751px) and (max-width:800px){
div.attention p.detail { margin:10px 0 0 0; font-size:90%; text-align:center; line-height:2em; letter-spacing:0; }
}


/* ------------------------------------------------------
800 - 850
-------------------------------------------------------- */
@media screen and (min-width: 801px) and (max-width:850px) {
div.attention p.detail { margin:10px 0 0 0; font-size:90%; text-align:center; line-height:2em; letter-spacing:0; }
}


/* ------------------------------------------------------
850 - 900
-------------------------------------------------------- */
@media screen and (min-width: 851px) and (max-width:900px) {
}


/* ------------------------------------------------------
900 - 1000 （xperia z ultra 横）
-------------------------------------------------------- */
@media screen and (min-width: 901px) and (max-width:1000px) {
/* ------------------------------------------------------
900 - 1000（pc）
-------------------------------------------------------- */
@media screen and (max-width : 1000px) and (min-height : 600px) {
}
}


/* ------------------------------------------------------
1000 - 1100（ipad 横）
-------------------------------------------------------- */
@media screen and (min-width: 1001px) and (max-width:1100px){
/* ------------------------------------------------------
1000 - 1100（ height 700まで）
-------------------------------------------------------- */
@media screen and (max-width : 1100px) and (max-height : 700px) {
}
}


/* ------------------------------------------------------
1100 - 1200
-------------------------------------------------------- */
@media screen and (min-width: 1101px) and (max-width:1200px){
/* ------------------------------------------------------
1100 - 1200（ height 700まで）
-------------------------------------------------------- */
@media screen and (max-width : 1200px) and (max-height : 700px) {
}
}

/* ------------------------------------------------------
1200 - 1300
-------------------------------------------------------- */
@media screen and (min-width: 1201px)and (max-width:1300px) {
/* ------------------------------------------------------
1200 - 1300（ height 700まで）
-------------------------------------------------------- */
@media screen and (max-width : 1300px) and (max-height : 700px) {
}
}


/* ------------------------------------------------------
1300 - 1400
-------------------------------------------------------- */
@media screen and (min-width: 1301px) and (max-width:1400px) {
/* ------------------------------------------------------
1300 - 1400（ height 700まで）
-------------------------------------------------------- */
@media screen and (max-width : 1400px) and (max-height : 700px) {
}
}

/* ------------------------------------------------------
1400 - 1500
-------------------------------------------------------- */
@media screen and (min-width: 1401px) and (max-width:1500px) {
/* ------------------------------------------------------
1400 - 1500（ height 700まで）
-------------------------------------------------------- */
@media screen and (max-width : 1500px) and (max-height : 700px) {
}
}


/* ------------------------------------------------------
1500 - 1600
-------------------------------------------------------- */
@media screen and (min-width: 1501px) and (max-width:1600px) {
/* ------------------------------------------------------
1500 - 1600（ height 700まで）
-------------------------------------------------------- */
@media screen and (max-width : 1600px) and (max-height : 700px) {
}
}


/* ------------------------------------------------------
1600 - 1700
-------------------------------------------------------- */
@media screen and (min-width: 1601px) and (max-width:1700px) {
/* ------------------------------------------------------
1600 - 1700（ height 700まで）
-------------------------------------------------------- */
@media screen and (max-width : 1700px) and (max-height : 700px) {
}
}

/* ------------------------------------------------------
1700 - 1800
-------------------------------------------------------- */
@media screen and (min-width: 1701px)and (max-width:1800px) {
/* ------------------------------------------------------
1700 - 1800（ height 700まで）
-------------------------------------------------------- */
@media screen and (max-width : 1800px) and (max-height : 700px) {
}
}

/* ------------------------------------------------------
1800 - 2000
-------------------------------------------------------- */
@media screen and (min-width: 1801px)and (max-width:2000px) {
/* ------------------------------------------------------
1800 - 2000（ height 700まで）
-------------------------------------------------------- */
@media screen and (max-width : 2000px) and (max-height : 700px) {
}
}


/* ------------------------------------------------------
2000 -
-------------------------------------------------------- */
@media screen and (min-width: 2001px) {
/* ------------------------------------------------------
- 2300（ height 700まで）
-------------------------------------------------------- */
@media screen and (max-width : 2300px) and (max-height : 700px) {
}
}