h2{width: 95%; max-width: 820px;}
h3{font-size: 18px; padding-bottom: 8px;}



.menu{width: 95%; max-width: 670px; margin: 0 auto; padding-top: 10px;}
.menu li{float: left; width: 24%; padding: 3px 0.25%; max-width: 161px;}
.menu li img{width: 100%;}
.menu a{padding-top: 32%; display: block; background-position: 0 0;}
.menu a:hover{background-position: 100% 0;}

.menu_story1 a{ max-width: 161px; background: url(../images/story/btn_menu1.png) no-repeat left top; -moz-background-size:200% auto; background-size:200% auto;}
.menu_story2 a{ max-width: 161px; background: url(../images/story/btn_menu2.png) no-repeat left top; -moz-background-size:200% auto; background-size:200% auto;}
.menu_story3 a{ max-width: 161px; background: url(../images/story/btn_menu3.png) no-repeat left top; -moz--size:200% auto; background-size:200% auto;}
.menu_story4 a{ max-width: 161px; background: url(../images/story/btn_menu4.png) no-repeat left top; -moz-background-size:200% auto; background-size:200% auto;}

.story1 .menu_story1 a{background-position: 100% 0;}
.story2 .menu_story2 a{background-position: 100% 0;}
.story3 .menu_story3 a{background-position: 100% 0;}
.story4 .menu_story4 a{background-position: 100% 0;}

.pf-box{width: 95%; max-width: 820px; margin: 0 auto; margin-top: 32px; border-top: solid 1px #55328f; padding-top: 24px; font-size: 12.96px; color: #f2c8fe;}
.pf-box-title{font-size: 29.124px; color: #f2c8fe; padding-bottom: 8px;}
.pf-box-left{width: 39%; margin: 0 auto; float: right; text-align: left;}
.pf-box-left img{width: 100%; max-width: 320px;}
.pf-box-right{width: 58%; margin: 0 auto; float: right;  margin-right: 2%;}
.info-btn a{color: #fff; background: #cb4141; display: block; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 5px 1%; text-align: center; font-size: 18px; width: 50%; max-width: 180px; float: right;}
.info-btn{padding-top: 8px; width: 100%; }

.pf-box-info-data li{text-indent: -10px; padding-left: 10px;}

.text-box{width: 95%; max-width: 700px; margin: 0 auto;}

.wd-ss-box{width: 100%; margin: 0 auto; padding: 16px 0;}
.wd-ss-box img{width: 100%;}

 
.new_story,.old_story{font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Meiryo,"メイリオ","ＭＳ Ｐゴシック",Arial,Helvetica,sans-serif; line-height: 180%;}
.new_story{width: 100%; background: url(../images/story/new_story_bg.jpg) no-repeat center top; padding-top: 3%; padding-bottom: 10%; text-shadow: 1px 1px 3px #000;}
.old_story{width: 100%; background: url(../images/story/old_story_bg.jpg) no-repeat center bottom; padding-top: 3%; padding-bottom: 10%; text-shadow: 1px 1px 3px #000;}

.new_story p {width: 90%; max-width: 650px; padding: 3% 0 0 0; margin: 0 auto;}
.new_story p strong{font-size: 25px;}

.old_story p {width: 90%; max-width: 650px; padding: 3% 0 0 0; margin: 0 auto;}
.old_story p strong{font-size: 25px;}

.common_cont_box_top{margin-top: 10px;}
.common_cont_box_box dl{width: 95%; max-width: 820px; margin: 0 auto; color: #f2c8fe; padding-top: 20px;}
.common_cont_box_box dt{font-size: 30px; border-bottom: solid 1px #cd90de; font-weight: bold;}
.common_cont_box_box dd{color: #cd90de;}

.updete-icon{width: 100%; max-width: 50px; margin: 0 auto; padding: 0; font-size: 12px;}
.updete-icon img{margin:0; padding:0;}

.bigfont{font-size: 25px;}


@media screen and (max-width: 640px) {

.new_story{ padding-top: 10%; -moz-background-size:200% auto; background-size:200% auto; }
.old_story{ padding-top: 10%; -moz-background-size:200% auto; background-size:200% auto; }

.menu{width: 90%; max-width: 320px; margin: 0 auto; padding-top: 10px;}
.menu li{width: 48.5%;}


.pf-box-left{width: 95%; margin: 0 auto 16px auto; float: none; text-align: center;}
.pf-box-right{width: 95%; margin: 0 auto; float: none; font-size: 14px;}
.info-btn{padding-top: 16px; width: 95%; margin: 0 auto; }
.info-btn a{font-size: 18px; width: 100%; max-width: 100%; float: none;}
.pf-box-title{text-align: center; padding-bottom: 16px;}
.pf-box-info-data li{padding-bottom: 8px;}
}


@media screen and (max-width: 520px) {
.menu li{display:block;}
}

@media screen and (max-width: 400px) {

}
