﻿@charset "utf-8";
/*
1.common
2.#contents
3.second
4.#side
5.#footer
*/
/*--------------------------------------------------
1.common
--------------------------------------------------*/
/* body,html */
html {position:relative; min-height:100%;}
body {overflow-x:hidden; background:#fff; color:#333; -webkit-transition:all .5s ease; transition:all .5s ease;}
img {max-width:100%; height:auto;}
#wrapper {position:relative; width:100%; min-height:1300px; height:100%; background:#fff; z-index:2;}
.bg{background:url(../img/bg_ue.jpg)left top repeat-x;height:224px;}
/* font-sizeの指定はfont-size:14px; font-size:1.4rem;のように両方書く */
/* link */
a {text-decoration:none; transition:color 0.3s;}
a:link {color:#b72600;}
a:visited {color:#b72600;}
a:hover {color:#e13800; text-decoration:none;}
a:active {color:#e13800;}
/* #pageTop */
#pageTop a {display:block; width:44px; height:44px; position:fixed; bottom:10px; right:10px; z-index:20; background:url(../img/btn_pagetop.png) no-repeat; border:none; text-indent:100%; white-space:nowrap; overflow:hidden;}
#pageTop a:hover {filter:alpha(opacity=70); -moz-opacity:0.8; opacity:0.8; transition:opacity 0.8s;}
/* btn */
.btn_link {margin:-25px 0 40px;}
.btn_link a {padding:6px 23px 6px 8px; background:#e6f5ff url(../img/arrow_red.png) 97% 50% no-repeat; border-radius:3px; color:#b72600; text-decoration:none;}
.btn_link a:hover {background-image:url(../img/arrow_or.png); color:#e13800;}

.btn_pay {clear:both; margin-top:30px; text-align:center;}
.btn_pay a {position:relative; display:inline-block; width:480px; padding:12px 30px 12px 15px; background:#FF9800 url(../img/arrow_w.png) 96% 50% no-repeat; border-radius:3px; border:1px solid #f0cf9f; box-shadow:0 0 1px 0 #fff inset,2px 2px 0 #de9003; color:#fff; font-size:15px; font-size:1.5rem; font-weight:bold; text-decoration:none;}
.btn_pay a:hover {position:relative; top:2px; right:-2px; top:0\9; right:0\9; background-color:#FF9800; box-shadow:0 0 1px 0 #fff inset,0 0 0 #f0cf9f;}
html:not(:target) .btn_pay a:hover {top:2px; right:-2px; /* IE9 */}
@media all and (-ms-high-contrast:none){.btn_pay a:hover {top:2px; right:-2px;} /* IE10 */}

.sns {list-style:none; text-align:center;}
.sns li {display:inline;padding:0 20px;}

.red{color:#c30028;}
/*--------------------------------------------------
2.#contents
--------------------------------------------------*/
#contents {margin:0 20px 0 278px;}
.contentsIn {max-width:900px; margin:-220px auto 0; padding-bottom:35px;}
.mainImg {padding-top:13px;margin:0 -45px;}

.title_list {background:none;}
.list {max-width:900px; margin:15px 0; font-size:0;}
.list li {display:inline-block; width:32%; margin:0 2% 2% 0; vertical-align:top;}
.list li:nth-child(3n) {margin-right:0;}
/* IE8 */
.list > *:first-child + * + *,.list > *:first-child + * + * + * + * + *,
.list > *:first-child + * + * + * + * + * + * + * + * {margin-right:0;}
.list h3 {padding-top:4px; color:#d62f51; font-size:14px; font-size:1.4rem;}
.list_txt {text-align:center; font-size:82%; font-weight:bold;}
.list p {padding-top:1px; color:#333; font-size:13px; font-size:1.3rem;}
.list a:hover img {filter:alpha(opacity=80); -moz-opacity:0.8; opacity:0.8;}

.title_present_top {margin-bottom:10px;}
.present_txt_top {margin-bottom:40px;}
.title_twitter_top {margin-bottom:35px;}

.title_caution {margin-bottom:6px; color:#552e31; font-size:18px; font-size:1.8rem; font-weight:bold;}
.title_caution img {margin:-4px 6px 0 0; vertical-align:middle;}
.caution_list {position:relative;}
.caution_list li {padding:0 0 5px 18px;}
.caution_list li:before {content:"※"; position:absolute; left:0;}

.sponsorship {margin-top:35px; text-align:center;}
/*--------------------------------------------------
3.second
--------------------------------------------------*/
.mainImg_second_box {position:relative;}
.second_sns {position:absolute; right:0.5%; top:0.5%; min-width:14%;}

.title_second {position:relative; border-bottom:1px #e7e7e7 solid; z-index:1;}
.title_second_txt {padding-bottom:10px; margin-top:30px; background:url(../img/dotted.png) left bottom repeat-x; color:#552e31; font-size:18px; font-size:1.8rem;}
.title_second_txt img {margin:-8px 7px 0 0; vertical-align:middle;}
.second_txt {margin:7px 0 40px 0; font-size:16px; font-size:1.6rem;}

.title_item {margin-bottom:-7px; color:#552e31; font-size:18px; font-size:1.8rem; font-weight:bold;}
.title_item img {margin:-4px 6px 0 0; vertical-align:middle;}
.item_box {margin-bottom:15px; overflow:hidden;}
.item_box dt {float:left; clear:left; width:84px; padding:15px 0; }
.item_box dt img {width:84px; height:84px; padding:2px; border:1px solid #e7e7e7; outline:solid 1px #fff; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; -ms-box-sizing: content-box;}
.item_box dd {min-height:120px; min-height:116px\9; padding:15px 0 15px 104px; border-top:1px dotted #999;}
@media all and (-ms-high-contrast:none){.item_box dd {min-height:114px;} /* IE10 */}
@media all and (-ms-high-contrast:none){*::-ms-backdrop, .item_box dd {min-height:114px;} /* IE11 */}
.item_box dt:first-child + dd {border-top:none;}
.item_h3 {font-size:16px; font-size:1.6rem; font-weight:bold;}
.item_h3 span {color:#d84111;}
.item_txt {margin:3px 0 4px;}
.item_price {color:#ff5722; font-size:16px; font-size:1.6rem; font-weight:bold;}
.item_point {display:inline-block; padding:0 5px 0; line-height:2; background:#f7501b; color:#fff; font-size:13px; font-size:1.3rem; border-radius:2px;}
.title_item_list {margin-bottom:8px; color:#552e31; font-size:16px; font-size:1.6rem; font-weight:bold;}
.title_item_list img {margin:-4px 7px 0 0; vertical-align:middle;}

.second_banner {margin-top:30px; text-align:center;}
.second_banner li {display:inline-block; padding:10px 20px 0;}
.second_banner a:hover img {filter:alpha(opacity=70); -moz-opacity:0.7; opacity:0.7;}
.first_time{font-size:1.5em;color:#fff;background-color:#02a1bb;text-align:center;line-height:2;margin:15px 0 10px;}
.second_time{font-size:1.5em;color:#fff;background-color:#02a1bb;text-align:center;line-height:2;margin:10px 0;}

/* 各ページ個別css */
#suddenattack .item_present {float:right; margin-left:15px;}
#nol .item_list_p {padding:3px 5px 1px; margin:4px 0 6px; background:#F3F3EC; border:1px #e5e5e1 solid; color:#471307; font-weight:bold;}
#nol .item_list_ul {padding-left:5px;}
#nol .item_list_last {margin-bottom:20px;}
#nol .item_list_ul li {padding-bottom:5px;}
#nol .item_list_ul span {color:#471307; font-weight:bold;}

/* present.html */
.title_present {position:relative; margin:0 0 20px; z-index:1;}
.title_present_txt {clear:both; color:#552e31; font-size:18px; font-size:1.8rem; font-weight:bold;}
.title_present_txt img {margin:-5px 7px 0 0; vertical-align:middle;}
.present_photo {margin-bottom:20px; text-align:center;}
.present_txt {margin:9px 0 30px 0; font-size:16px; font-size:1.6rem;}
.present_listL,.present_listR {width:46%; float:left; padding:10px 0 20px;}
.present_listR {float:right;}
.present_list {margin-bottom:8px;}
.present_list li {padding:0 0 4px 14px ;font-size:15px; font-size:1.5rem;}
.present_list .arrow_br {padding-bottom:0; background:url(../img/arrow_br.png) left 4px no-repeat; font-size:16px; font-size:1.6rem;}
.present_ol_listL {float:left; width:75%;}
.present_ol_list {margin:10px 0 20px 0; font-size:16px; font-size:1.6rem; line-height:1.6;}
.present_ol_list li {position:relative; padding-left:27px; margin-bottom:12px;}
.present_ol_list li:before {position:absolute; left:0; top:4px; width:20px; height:20px; border-radius:100%; background:#e73b8f; color:#fff; font-weight:bold; text-align:center; line-height:20px;}
.present_ol1:before {content:"1";}
.present_ol2:before  {content:"2";}
.present_ol3:before  {content:"3";}
.present_receipt {float:right; width:23%; margin-bottom:20px;}
#present .btn_pay a {width:400px;}

/* form.html */
.formCon{position:relative; margin:5px 0 0 0; z-index:1;}
.formCon .form_txt{margin:7px 0 10px 10px; font-size:16px; font-size:1.6rem;}
.formCon .title_second_txt{margin-top:10px;}
.formCon .error {margin:20px 0 0 0;padding:10px 10px 10px 30px;font-size:16px;line-height:15px;color: #FF3939;border:1px #FF3939 solid;background:url(../../../Common/images/icn/cancel.png) 7px 11px no-repeat;display:block;}


.formCon .formBox dl.form{padding:10px; border:1px solid #CACACA; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 10px;}
.formCon .formBox dl.form dt{ width: 180px; float: left; font-weight:bold; padding:5px; line-height:29px;}
.formCon .formBox dl.form dd{ margin-left: 180px; padding:5px;}


.formCon .formBox .button{position:relative; height:30px;display:inline-block; margin-right:5px; }
.formCon .formBox .button span{height:28px;line-height: 26px; position:relative; top:-1px; top:0\9; display:inline-block; color: #fff; padding: 0px 10px; background: #ec5272; border: 1px solid #d62f51; box-shadow: 0 0 1px 0 #fff inset,1px 1px 0 #d62f51; border-radius: 3px; font-weight:bold;}
.formCon .formBox .button:hover span{ background:#FC7B96; box-shadow: 0 0 1px 0 #fff inset,0px 0px 0 #d62f51;top:0px; left:1px; left:0\9;}

.formCon .formBox .btn_checkAuth span{padding: 0px 30px; }
.formCon .formBox .form_btn {padding:20px 0 30px; margin:0 auto; text-align: center;}

/*
.formBox .waku{ margin:10px 0 30px 0; padding:15px; border:1px solid #CACACA; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px;}
.formBox .waku .cp_point,.formBox .waku .cp_entry{ margin:5px 0;}
.formBox .waku .cp_point li,.formBox .waku .cp_entry li{display: inline-block; vertical-align:middle; margin-top:5px;}
*/
.formCon .formBox input{padding:5px 5px 4px; margin:0 5px 5px 0;}
.formCon .formBox input#txtEmail {width:95%; max-width:400px; }
.formCon .formBox input#txtPoint {text-align:right}

.formCon .formBox .form span.attention {margin: 5px 0 0 0;font-size: 12px;line-height: 15px;display: block; clear: both;}
.formCon .formBox .form span.info {margin:5px 0 0 0;padding:5px 5px 5px 24px;font-size:12px;line-height:15px;border:1px #1687de solid;background:url(../../../Common/images/icn/information.png) 5px 5px no-repeat;display:block;}
.formCon .formBox .form span.warning {margin:5px 0 0 0;padding:5px 5px 5px 24px;font-size:12px;line-height:15px;color: #FF3939;border:1px #FF3939 solid;background:url(../../../Common/images/icn/cancel.png) 5px 5px no-repeat;display:block;}

.formCon h3.title_present_txt { margin: 20px 0 10px;}

.ui-dialog .ui-dialog-titlebar{border-bottom: 1px solid silver;border-radius: 0px;}
.divDialog {max-width:700px; }
.divDialog .history {height:280px; padding:10px}
.divDialog .history #tbHistory{width:100%; margin-bottom: 10px;}
.divDialog .history #tbHistory thead{}
.divDialog .history #tbHistory tr{}
.divDialog .history #tbHistory thead td {text-align:center; font-weight:bold;}
.divDialog .history #tbHistory td{ padding: 5px 7px; font-size:13px; border:1px solid silver;}
.divDialog .history #tbHistory td.type{white-space:nowrap;}
.divDialog .history #tbHistory td.no{text-align:center;}
.divDialog .history #tbHistory td.point{text-align:right;white-space:nowrap;}
.divDialog .history #tbHistory td.date{}
/*
.formBox .cptxt{ font-size:15px; font-size: 1.5rem;font-weight: bold;}
.formBox .waku .pointBox{ display:inline-block; padding:5px; margin-right:5px; text-align:right; width:100px; border:1px solid #BCBCBC;}
.formBox .waku .pt{font-weight:bold;}
.formBox .waku .txtbox{padding-left:5px;}
.formBox .waku .entry,.formBox .waku .history{padding-left:10px;}
.formBox .waku .entry input,.formBox .waku .history input{ position:relative; padding:4px 40px; border-radius: 3px;  color: #fff;  font-size: 15px;  font-size: 1.5rem; font-weight: bold;}
.formBox .waku .entry input{ background: #ec5272; border: 1px solid #d62f51; box-shadow: 0 0 1px 0 #fff inset,2px 2px 0 #d62f51;}
.formBox .waku .history input{background: #68CC79; border: 1px solid #4B9462; box-shadow: 0 0 1px 0 #fff inset,2px 2px 0 #52946D;}
.formBox .waku .entry input:hover,.formBox .waku .history input:hover{position:relative; top:2px; right:-2px; top:0\9; right:0\9; cursor:pointer;}
html:not(:target) .formBox .waku .entry input:hover,.formBox .waku .history input:hover{top:2px; right:-2px; /* IE9 * /}
@media all and (-ms-high-contrast:none){	.formBox .waku .entry input:hover,.formBox .waku .history input:hover {top:2px; right:-2px;} /* IE10 * /}
.formBox .waku .entry input:hover{background-color:#f35e7d; box-shadow:0 0 1px 0 #fff inset,0 0 0 #d62f51;}
.formBox .waku .history input:hover{background-color:#71d983; box-shadow:0 0 1px 0 #fff inset,0 0 0 #52946D;}
.formBox .attention{font-size:12px; color:#E9866A;}
*/

.present_content{margin-bottom:30px;}
.present_content .box{ width:49.4%; box-sizing: border-box; -webkit-box-sizing: border-box; float: left; border: 1px solid #CACACA; border-radius: 7px; padding: 10px; margin-bottom:10px;}
.present_content .odd{width:1.2%; float:left; height:10px;}
.present_content .even{ display:none;}
.present_content .box .icon{ position:relative; float:left;}
.present_content .box .icon img{margin:5px;}
.present_content .box .icon .number{ position: absolute; top: 80px; left:-5px; display: inline-block; background: #80B824; color: white; border: 1px solid #63970E; border-radius: 100px; width: 42px; height: 40px; line-height: 38px; font-size:9px; font-size:0.9rem; white-space:nowrap; text-align:center;}
.present_content .box .icon .number em{ font-size:14px; font-size:1.4rem; font-style:normal; font-weight:bold; }
.present_content .box .icon .add{position: absolute; display: block; top: 110px; left: 29px; font-size: 11px; color: red; font-weight: bold; z-index: 10; white-space: nowrap; }

.present_content .box .info { padding: 5px; margin-left: 110px; height: 100px;}
.present_content .box .info .name{padding-bottom: 7px; margin-bottom: 5px; background: url(../img/dotted.png) left bottom repeat-x;font-weight: bold; max-height: 57px;}
.present_content .box .info .point{}
.present_content .box .info .count{}
.present_content .box .enter {text-align:center; margin-left: 90px;}
.present_content .box .enter .button{position:relative; height:30px;display:block; margin:5px auto 0; width: 60%; min-width: 120px; }
.present_content .box .enter .button span{height:26px; width:100%; line-height: 24px; position:relative; top:-1px; top:0\9; display:inline-block; color: #fff; padding: 0px 10px; background: #ec5272; border: 1px solid #d62f51; box-shadow: 0 0 1px 0 #fff inset,1px 1px 0 #d62f51; border-radius: 5px; font-weight:bold;}
.present_content .box .enter .button:hover span{ background:#FC7B96; box-shadow: 0 0 1px 0 #fff inset,0px 0px 0 #d62f51;top:0px; left:1px; left:0\9;}

/*
.present_content .miniBox{display:inline-block; vertical-align: top; width:49%; margin:10px 0.3% 0 0; padding:10px; border:1px solid #CACACA; border-radius: 7px; -webkit-border-radius: 7px; -moz-border-radius: 7px;}
.present_content .miniBox .icon{display:inline-block; width:100px; margin-right:5px;}
.present_content .miniBox .txt{display:inline-block; vertical-align:top; }
.present_content .miniBox .txt .name,.present_content .miniBox .txt .how{font-weight:bold;}
.present_content .miniBox .entry input{display:block; width:55%; margin:0 auto; padding:3px; text-align:center; background:#ec5272; color: #fff; border-radius: 10px; border: 1px solid #d62f51;}
.present_content .miniBox .entry input:hover{background-color:#f35e7d; cursor:pointer;}
*/
/* Twitterキャンペーンページ */
.cp_tw{max-width:900px; margin:0 auto; background-image:url(../img/twitter/main_bg.png),url(../img/twitter/main_bg.gif); background-position:center top, left top; background-repeat:no-repeat,repeat; -moz-background-size:100% auto; background-size:100% auto,auto; position:relative; z-index:1; margin-top:10px;
border-bottom-right-radius:15px; border-bottom-left-radius:15px;}
.cp_tw .title_second{border:none; text-align:center;}
.cp_tw .title_s{ margin:15px 0; text-align:center;}
.cp_tw .cp_box{display:table; margin:0 auto; padding:0 10px;}
.cp_tw .cp_box #twitter{display:table-cell; width:60%; vertical-align:middle;}
.cp_tw .cp_box .tw_btn{display:table-cell; width:40%; vertical-align:middle; padding-left:15px;}
.cp_tw .cp_box .tw_btn p{margin-bottom:7px;}
.cp_tw .counter{ width:55%; margin:0 auto; padding:5.5% 3.1% 1% 0; background:url(../img/twitter/count_bg.png) no-repeat; background-size:100%;}
.numb {}
.numb:after{content: ""; display:block; clear:both; }
.numb span {text-indent: -9999px; padding-top:20%; float: right;display: block;}
.numb span.num1 {background: url(../img/twitter/1.jpg) no-repeat left top;width: 11%; margin:0 1.8% 0 2.8%; background-size:100%;}
.numb span.num2 {background: url(../img/twitter/2.jpg) no-repeat left top;width: 11%; margin:0 1.8% 0 2.8%; background-size:100%;}
.numb span.num3 {background: url(../img/twitter/3.jpg) no-repeat left top;width: 11%; margin:0 1.8% 0 2.8%; background-size:100%;}
.numb span.num4 {background: url(../img/twitter/4.jpg) no-repeat left top;width: 11%; margin:0 1.8% 0 2.8%; background-size:100%;}
.numb span.num5 {background: url(../img/twitter/5.jpg) no-repeat left top;width: 11%; margin:0 1.8% 0 2.8%; background-size:100%;}
.numb span.num6 {background: url(../img/twitter/6.jpg) no-repeat left top;width: 11%; margin:0 1.8% 0 2.8%; background-size:100%;}
.numb span.num7 {background: url(../img/twitter/7.jpg) no-repeat left top;width: 11%; margin:0 1.8% 0 2.8%; background-size:100%;}
.numb span.num8 {background: url(../img/twitter/8.jpg) no-repeat left top;width: 11%; margin:0 1.8% 0 2.8%; background-size:100%;}
.numb span.num9 {background: url(../img/twitter/9.jpg) no-repeat left top;width: 11%; margin:0 1.8% 0 2.8%; background-size:100%;}
.numb span.num0 {background: url(../img/twitter/0.jpg) no-repeat left top;width: 11%; margin:0 1.8% 0 2.8%; background-size:100%;}
.cp_tw .period{text-align:center; padding:0 10px 10px 10px;}
.reward{ margin:15px auto 0; display:inline-block;}
.reward:after{content: ""; display:block; clear:both; }
.reward li{ width:31%; float:left; margin:5px 0.7% 0; position:relative;}
.reward li .stamp{ width:35%; position:absolute; top:6%; right:33%;}
.cp_infoBox{ margin:20px auto 0; padding:0 10px 10px 10px; background:#f6ffe2; border:5px solid #d2e5a9; border-radius:10px;}
.cp_infoBox .caption{ margin:-20px 0 10px 0;}
.cp_infoBox .note{display:table; margin:0 0 10px 5px;}
.cp_infoBox .note li{display:table-cell; vertical-align:middle; padding-left:7px;}
.cp_infoBox .note li.notenum{ width:40px; height:40px; background-color:#3CA58C; color:#FFF; padding:5px; text-align:center; font-weight:bold; font-size:21px;
 border-radius:25px;}
.cp_infoBox .tw_btn{display:table; width:100%;}
.cp_infoBox .tw_btn li{display:table-cell; width:50%; text-align:center;}
.cp_infoBox .tw_btn p{margin-bottom:7px;}
.cp_infoBox .caution{font-size:13px; margin-left:7px;}
.tw_btn .btn a:hover{opacity:0.7; filter: alpha(opacity=70); -ms-filter: "alpha(opacity=70)";}

/*--------------------------------------------------
4.#side
--------------------------------------------------*/
#side {position:absolute; left:0; top:0px; width:257px; min-height:100%;z-index:5; background:#f8f8f8 url(../img/side_bg.png) right repeat-y;}
.shoplist_btn{background-color:#fff;}
.shoplist_btn a:hover{opacity:0.7;}
.imgtow{margin-left:8px;}
.link_paynet {text-align:center;}
.title_menu {margin-right:-3px;}
.nav {width:246px; margin:5px 0 19px;}
.nav li {display:table;}
.nav .lh {line-height:1.2;}
.nav span {display:block; float:left;  margin-right:10px;}
.nav li a {display:table-cell; width:246px; height:43px; padding-left:48px; color:#333; vertical-align:middle; border-bottom:1px solid #e7e7e7; box-shadow:0 1px 0 rgba(255, 255, 255, 1);}
.nav li a:hover {color:#8f5430; background:rgba(255, 255, 255, 0.2);}
.nav_mhf {background:url(../img/mhf/30x30.gif) 10px 50% no-repeat;}
.nav_pso2 {background:url(../img/pso2/30x30.gif) 10px 50% no-repeat;}
.nav_ava {background:url(../img/ava/30x30.gif) 10px 50% no-repeat;}
.nav_ragnarok{background:url(../img/ragnarok/30x30.gif) 10px 50% no-repeat;}
.nav_nol {background:url(../img/nol/30x30.gif) 10px 50% no-repeat;}
.nav_201x {background:url(../img/201x/30x30.gif) 10px 50% no-repeat;}
.nav_musou {background:url(../img/musou/30x30.gif) 10px 50% no-repeat;}
.nav_dj5 {background:url(../img/dj5/30x30.gif) 10px 50% no-repeat;}
.nav_cso {background:url(../img/cso/30x30.gif) 10px 50% no-repeat;}
.nav_suddenattack {background:url(../img/suddenattack/30x30.gif) 10px 50% no-repeat;}
.nav_kansensyoujo {background:url(../img/kansensyoujo/30x30.gif) 10px 50% no-repeat;}
.nav_muramasa {background:url(../img/muramasa/30x30.gif) 10px 50% no-repeat;}
.nav_rickg{background:url(../img/rickg/30x30.gif) 10px 50% no-repeat;}
.nav_kusen {background:url(../img/kusen/30x30.gif) 10px 50% no-repeat;}
.nav_wondereffect{background:url(../img/wondereffect/30x30.gif) 10px 50% no-repeat;}
.nav_alfheim {background:url(../img/alfheim/30x30.gif) 10px 50% no-repeat;}
.nav_kakuriyo {background:url(../img/kakuriyo/30x30.gif) 10px 50% no-repeat;}
.nav_goetia {background:url(../img/goetia/30x30.gif) 10px 50% no-repeat;}



.banner {width:250px; text-align:center;}
.banner li {margin-bottom:20px; line-height:0;}
.banner a:hover img {filter:alpha(opacity=70); -moz-opacity:0.7; opacity:0.7;}

.side-menu-btn {display:none;}
/*--------------------------------------------------
5.#footer
--------------------------------------------------*/
#footer {position:relative; width:100%; padding-top:15px; border-top:1px #e7e7e7 solid; box-shadow:0 1px 0 rgba(255, 255, 255, 1); background:url(../img/plaid_pat.png) center top repeat; text-align:center; z-index:10;}
.footNav {display:inline; padding:5px 10px; border-radius:3px; background:#fff; font-size:12px; font-size:1.2rem; }
.footNav li {display:inline-block; list-style:none; padding-left:8px; background:url(../img/arrow_blk.png) 0 50% no-repeat }
.footer_txt {padding:10px 2% 0; font-size:10px; font-size:1.0rem;}
.copyright {padding:8px 2% 10px; font-size:10px; font-size:1.0rem;}

@media screen and (min-width:769px) and (max-width:865px){
	.present_content .box{ width:100%; }
	.present_content .odd{display:none;}
}
@media screen and (max-width:768px) {
/*--------------------------------------------------
1.common
--------------------------------------------------*/
#wrapper {min-height:1005px;}
.bg{display:none;}
.btn_pay a {width:80%;}
/*--------------------------------------------------
2.#contents
--------------------------------------------------*/
#contents {width:100%; margin-left:0; margin:0 auto;}
.contentsIn {margin:0 15px;}
.list li {width:46%; margin:0 2% 2% 2%;}
.list li:nth-child(3n) {margin-right:2%;}
/*--------------------------------------------------
3.second
--------------------------------------------------*/
.second_sns {right:-2%; bottom:22%;}
.second_banner {margin-top:20px;}
.second_banner li {padding-top:20px;}
/* present_css */
.present_ol_listL {float:none; width:100%;}
.present_ol_list {margin:9px 0 10px 0;}
.present_ol_list li {margin-bottom:5px; line-height:1.5;}
.present_ol_list li:before {top:2px;}
.present_receipt {float:none; width:100%; text-align:center;}
.second_time {line-height: 1.5;margin: 10px 0;padding:5px 0;}
.first_time {line-height: 1.5;margin: 10px 0;padding:5px 0;}



/*--------------------------------------------------
4.#side
--------------------------------------------------*/
.overlay {content:''; visibility:hidden; position:fixed; top:0; left:0; display:block; width:100%; height:100%; background:rgba(0,0,0,0); -webkit-transition:all .5s ease; transition:all .5s ease; z-index:3;}
.overlay::after {content:"CLOSE"; visibility:hidden; position:fixed; top:40%; left:0; display:block; width:100%; height:50px; color:rgba(255,255,255,0); font-size:30px; font-size:3.0rem; font-weight:bold; text-align:center; -webkit-transition:all .5s ease; transition:all .5s ease;}
.side-open .overlay {visibility:visible; cursor:pointer; background:rgba(0,0,0,.7);}
.side-open .overlay::after {visibility:visible; color:rgba(255,255,255,.8);}
.side-menu-btn {display:block; position:fixed; top:10px; left:10px; width:40px; height:40px; border:solid 1px #ccc; border-radius:5px; background:rgba(255,255,255,0.8); cursor:pointer; z-index:4;}
.side-menu-btn span {display:block; position:absolute; top:50%; left:50%; width:14px; height:2px; margin:-1px 0 0 -7px; background:#666; transition:.2s;}
.side-menu-btn span:before, .side-menu-btn span:after{display:block; content:""; position:absolute; top:50%; left:0; width:14px; height:2px; background:#666; transition:.3s;}
.side-menu-btn span:before{margin-top:-6px;}
.side-menu-btn span:after{margin-top:4px;}

/* サイドメニューオープン */
.side-open #wrapper,.side-open .overlay {-webkit-transform:translate3d(244px, 0, 0); transform:translate3d(244px, 0, 0);}
.side-open #wrapper {z-index:0;}
.side-open .side-menu-btn span {background:transparent;}
.side-open .side-menu-btn span:before,.side-open .side-menu-btn span:after {margin-top:0;}
.side-open .side-menu-btn span:before {transform:rotate(-45deg); -webkit-transform:rotate(-45deg);}
.side-open .side-menu-btn span:after {transform:rotate(-135deg); -webkit-transform:rotate(-135deg);}

#side {width:244px; background:#f8f8f8; z-index:1;}
.nav {width:234px;}
.title_menu {margin-right:0;}
.banner {width:244px;}
/*--------------------------------------------------
5.#footer
--------------------------------------------------*/
.side-open #footer {z-index:0;}
}


@media screen and (max-width:600px) {
.present_content .box{ width:100%; }
.present_content .odd{display:none;}
}


@media screen and (max-width:480px) {
/*--------------------------------------------------
1.common
--------------------------------------------------*/
.contentsIn {padding-bottom:20px;}
.btn_link {margin:-8px 0 22px; text-align:center;}
.btn_pay {margin-top:20px;}
.sns li {margin:0 0 0 8px;}
/*--------------------------------------------------
2.#contents
--------------------------------------------------*/
.mainImg {margin:0 -4% 1% -4%;padding-top:12%;}
.list {width:100%; margin:13px 0 5px; text-align:center;}
.list li {width:80%; margin:0 0 10px 0;}
.list h3,.list p {padding-top:3px;}
.list p {padding-top:0;}
.title_present_top {margin-bottom:8px;}
.present_txt_top {margin-bottom:20px;}
.title_twitter_top {margin-bottom:20px;}
.sponsorship {margin-top:10px;}
/*--------------------------------------------------
3.second
--------------------------------------------------*/
.second_sns {right:-2.8%; bottom:0;}
.title_second_txt {padding-bottom:17px; margin-top:12px; background:url(../img/dotted_sp.png) left bottom repeat-x; background-size:23px 16px; line-height:1.2;}
.title_second_txt img {display:none;}
.second_txt {margin:5px 0 20px 0;}
.title_item {margin:0 0 -6px;}
.item_box dt {float:none; width:100%; padding:15px 0 8px; text-align:center;}
.item_box dd {min-height:auto; padding:0 0 15px 0; border-top:0; border-bottom:1px dotted #999; text-align:center;}
.second_banner {margin-top:10px;}
.second_banner li {padding-top:15px;}

/* 各ページ個別css */
#suddenattack .item_present {float:none; display:block; margin:0 0 10px 0; text-align:center;}
.second_time {line-height: 1.5;margin: 10px 0;padding:5px 0;}
.first_time {line-height: 1.5;margin: 10px 0;padding:5px 0;}
/* present_css */
.title_present {margin-bottom:15px;}
.title_present_txt {clear:both; color:#552e31; font-size:18px; font-size:1.8rem; font-weight:bold;}
.title_present_txt img {margin:-5px 7px 0 0; vertical-align:middle;}
.present_photo {margin-bottom:12px;}
.present_txt {margin:9px 0 20px 0;}
.present_listL,.present_listR {width:100%; float:none; padding:8px 0 0;}
.present_listR {float:none; padding:0 0 15px;}
.present_list {margin-bottom:3px;}
.present_list li {padding:0 0 2px 14px;}

#present .btn_pay a {width:60%;}
/* form.html */
.formBox .waku .cp_entry li.btn{display:block; width:282px; margin:10px auto 0;}
.present_content .miniBox{width: 100%;}

.formCon .formBox dl.form dt{ width: auto; float: none; line-height:normal; }
.formCon .formBox dl.form dd{ margin-left: 0px; }

/* Twitterキャンペーンページ */
.cp_tw .title_s{display:block; width:95%; margin:8px auto 0;}
.cp_tw .cp_box #twitter {display: block;width: 100%;}
.cp_tw .cp_box .tw_btn{display:block; width:83%; margin:0 auto; padding-left:0;}
.cp_tw .counter {width: 80%; padding:7.9% 5.1% 1% 0; margin:10px auto;}
.reward li {width: 48%;}
.cp_infoBox .tw_btn{display:block; padding-left:0;}
.cp_infoBox .tw_btn li{display:block; width:83%; margin:0 auto;}
.cp_infoBox .note li.notenum{border-radius:3px;}
}