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

*{ box-sizing: border-box;}

html,body,div,ul,ol,li,dl,dt,dd,form,fieldset,input,textarea,h1,h2,h3,h4,h5,h6,pre,code,p,blockquote,hr,th,td { margin:0; padding:0; }
html, body { height:100%; }
img { border: 0; vertical-align: bottom; border-style: none;}
a img { border-style:none;}
a { outline: none; }
a:link,a:visited,a:active {outline: none;}
a:link { color: #E9385B;}
a:visited { color: #E9385B;}
a:hover { color: #069;}
a:active { color: #09C;}

body { font-family:'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; background-color: #7b7c57; font-size: 16px; line-height: 1.5; color: #333; background-image:url(../img/bg.jpg); background-repeat:repeat-y; background-position:center;}
.opp{ filter:alpha(opacity=30)!important; -moz-opacity: 0.3!important; opacity: 0.3!important;}
.clearfix{ clear:both;}
.youtube { position: relative; width: 100%; max-width: 902px; margin: 0 auto 60px; font-size: 13px;}
.youtube iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important;}
.stage { position: relative; width: 100%; padding-top: 56.25%; margin-top:0;}
.stage iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important;}
iframe[name="google_conversion_frame"] { position:absolute; bottom:0; display:none;}
.movie{ width: 100%; margin: 0 auto; max-width: 1200px;}
.bgmov{ background-color:#000; padding:70px 0;}
.movnews{ text-align:center; color:#FFF; padding:0 0 20px 0;}
.movnews span{ font-size:80%; color: #f70606;}

.news{ padding:2%; text-align:center; background-color:#e80909; color:#FFF; background-image:url(../img/gm.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; text-shadow: 0 0 10px #000; position:relative;}
.news span{ color:#fbea00; font-size: 130%;}
.news { color:#FFF; text-decoration:none!important;}
.news img.tenp{ position:absolute; z-index:2; width:100px; right:13vw; top:8px;}
.news a{ color:#FFF;}
.nounder{ text-decoration:none;}

.header{ text-align:center; background-color:#f9f7f7; padding:8px 0; color:#999; font-family:Georgia, "Times New Roman", Times, serif; position:relative;}
.clearline{background-image: url(../img/line2.gif); height: 2px; background-position: center; box-shadow: 0px 2px 7px #000; position: relative;}
.notice{ width:90%; margin:0 auto 20px; font-size:80%;}

.content{ width:100%; margin:0 auto; text-align:center; padding:40px; background: linear-gradient(#502920, #2d170a); border-bottom:solid 1px #9a6363; border-top:solid 1px #9a6363;}
.content .inner{ border: solid 1px rgba(245, 226, 67, 0.55); padding: 3%; position:relative;}
.content .inner .c01{ position:absolute; top:0; left:0;}
.content .inner .c02{ position:absolute; top:0; right:0;}
.content .inner .c03{ position:absolute; bottom:0; left:0;}
.content .inner .c04{ position:absolute; bottom:0; right:0;}
.content .inner h5 { color: #ffffff; background-color: #d80303; padding: 15px 0 0 0; margin: 0 0.4em 0 0; width: 95px; height: 95px; line-height: 1.1; text-align: center; display: inline-block; border-radius: 50%; font-size: 180%; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.45); border: solid 1px rgba(255, 255, 255, 0.58); position: absolute; left: 3%;}
.content .inner .boximg{ text-align: center; border-top: dotted 1px #6f5a05; padding-top: 50px; margin-top: 50px;}
.content .inner .boximg img{ width:100%; max-width:1000px;}
.content .inner .boximg h3{ color: #FFd905; background: -webkit-linear-gradient(top, #fff46b 0%, #ffda3d 50%, #dc991f 55%, #fff704 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size:260%; letter-spacing: -0.03em; width: 90%;  margin: 0 auto 30px; line-height:1.3;}
.content .inner .boximg .notice{ text-align:left; color:#CCC; font-size:75%; padding-top: 10px;}

.content .inner .boximg2{ text-align: center; padding-top: 50px;}
.content .inner .boximg2 img{ width:100%; max-width:1000px;}
.content .inner .boximg2 .notice{ text-align:left; color:#CCC; font-size:75%; padding-top: 10px;}

.content h2 { width: 97%;  margin: 0 auto; color: #f3e362; font-size: 300%; background: -webkit-linear-gradient(top, #fff46b 0%, #ffda3d 50%, #dc991f 55%, #fff704 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.content h4{ color: #FFF; font-size: 156%; font-weight: 300; padding: 10px 0 0px; width: 90%; margin: 0 auto; text-align: center; line-height: 1.8;}
.content h4 span{ color:#ffe14b;}
.content p{ color:#FFF; padding:15px 0; font-size:150%;}
.content .box, .content .box2 { margin:60px auto 30px; }
.content .box a:hover img{ box-shadow:0 0 15px #fc0; padding:0;}
.content ul{list-style:none; width:100%; max-width:1320px; margin:20px auto 0;}
.content li{ display:block; width:50%; text-align:center; color:#FFF; float:left;}
.content li img{ width:100%; padding-bottom:10px;}
.content li h3{ font-weight:300; font-size:100%; margin-top:30px; display: inline-block; line-height: 1.3; padding: 4%; background-color: #1c1c1d; border-radius:6px; width:87%; color: #f0aa00;}
.content li h4{ font-weight: 100; font-size: 100%; color: #fff; width: 85%; text-align: left; margin: 0 auto; padding:0;}
.content .dlc_cloth{ color: #fff; width: 90%; margin: 30px auto 20px; font-size:130%; max-width: 1090px;}
.content .dlc_cloth h4{ color: #ffe14b; font-weight:100; padding-top:30px; border-bottom:dotted 1px; padding-bottom: 7px; margin-bottom: 7px;}

.content2 .pak{ width:86%; margin:0 auto;}
.content2 .pak .box2{ width:50%; float:left;}

.content2{ width:100%; margin:0 auto 0px; text-align:center; padding:40px 0 60px; background-color: #111; border-bottom:solid 1px #754848; position:relative;}
.content2 h3{ color: #FFd905; background: -webkit-linear-gradient(top, #fff46b 0%, #ffda3d 50%, #dc991f 55%, #fff704 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size:270%; letter-spacing: -0.03em; width: 90%;  margin: 0 auto 30px; line-height:1.3;}
.content2 .off30{ position:absolute; top:0; left:0; text-align: left;}
.content2 .off30 img{ width:70%;}

.content3{ width:100%; margin:0px auto 0; text-align:center; padding:40px 0 60px; background: linear-gradient(#c70707, #5b0000); border-bottom:solid 1px #9a6363; border-top:solid 1px #9a6363;}
.content3 h3 img{ width: 97%;  margin: 0 auto 20px; max-width: 1000px;}
.content3 p{ color:#FFF; font-size: 115%; font-weight: 300; letter-spacing: -0.03em; text-shadow: 0 0 15px #000; padding:10px 0 40px; width:90%; margin:0 auto; text-align:left; max-width: 1000px; line-height: 1.8;}
.content3 span{ color:#ffe14b;}
.content3 .box{ padding:30px 0;}
.content3 .box img{ padding:0 10px;}
.content3 .box { margin-top:40px; }
.content3 .box a:hover img{ box-shadow:0 0 15px #fc0; padding:0;}
.content3 ul{list-style:none; width:100%; max-width:1200px; margin:20px auto 0;}
.content3 li{ display:inline-block; width:34.5%; text-align:center; color:#FFF;}
.content3 li img{ width:65%; padding-bottom:10px;}
.content3 li h3{ font-weight:300; font-size:1.3vw; margin-bottom:30px; display: inline-block; line-height: 1.0; padding: 4%; background-color: #1c1c1d; border-radius:6px; width:87%;}
.content3 li h4{ font-weight: 100; font-size: 100%; color: #ffe14b; border-bottom: dotted 1px; width: 65%; text-align: center; margin: 15px auto 7px; padding-bottom:7px;}
.content3 li span{ font-size:110%; color: #fff;}
.content3 .dlc_cloth { margin: 40px auto 20px; font-size:100%; color:#ccc; display: inline-block; border: dotted 1px; border-radius: 10px; padding: 20px; text-align: left;}
.content3 .dlc_cloth h3{font-size: 150%; font-weight: 200; color: #fcdd44; padding-bottom:15px;}
.content3 .dlc_cloth h4{font-size: 120%; font-weight: 200; color:#fff;}
.content3 .dlc_cloth h5{ display:block; padding-top:10px; color: #ffe14b; font-size: 100%; font-weight: 400;}

#done ul{ list-style:none; max-width:1700px; margin:0 auto;}
#done li{ width: 48%; text-align: center; float: left; margin: 0 1%; position: relative; background-color:#FFF;}
#done li h5{ padding-top: 10px; font-size: 90%; font-weight: 100; color:#FFF; background-color:#000;}
#done li p{ margin: 5px 0; padding: 0; font-size: 13px; line-height: 135%; text-align: left; color: #666; width: 100%;}
#done li img{ width:100%;}
#done li a:hover{ filter:alpha(opacity=30)!important; -moz-opacity: 0.3!important; opacity: 0.3!important;}
#done li img.new{ margin:0 7px 2px; width:20%; max-width:35px;}
#done li .brtn { display: block; content: ''; width: 55px; height: 52px; background-image: url(../img/playbtn.png); position: absolute; top: 50%; left: 50%; margin-left: -40px; margin-top: -40px; background-size: 100%;}

.get_dlc { margin:60px auto; text-align:center; }
.get_dlc h3{ color: #222; font-size: 305%; display:inline-block; margin-bottom: 30px; font-weight: 700; text-shadow: 0 0 12px #ffc800; line-height: 1.3;}
.get_dlc h3 span{ font-size:90%; letter-spacing: -0.01em;}
.get_dlc h4{ font-size: 130%; font-weight: 400; width: 90%; margin: 0 auto;}
.get_dlc img{ width:90%; max-width:550px;}
.get_dlc a:hover img{ box-shadow:0 0 15px #fc0; }

.spec{ color:#222; text-align:center; padding-bottom:30px; font-size: 110%;}
.spec .inner{ width:90%; max-width:700px; margin:0px auto 40px; padding:40px 0 20px; text-align:left; border-bottom: solid 1px #b3b0b0; border-top: solid 1px #b3b0b0; position:relative;}
.spec .inner dl{ padding-bottom:30px;}
.spec .inner dt{ float:left; display:block; padding-bottom:10px;}
.spec .inner dd{ margin-left:8em; padding-bottom:10px;}
.spec .inner dd .notice2{ font-size:80%; line-height:1.4; color:#DEDCE0;}
.spec .inner dd .off{ background-color: #F00; padding: 0.3% 2%; border-radius: 15px; margin-top: 10px; display: inline-block; font-size:90%; color:#FFF;}

.footer{ text-align:center; font-size: 90%; padding: 50px 0 30px; font-family: Arial, Helvetica, sans-serif; background-color:#fff; color:#CCC;}
.footer a{ color:#777; text-decoration:none;}
.footer a:hover{ color:#f00; text-decoration:underline;}
.footer .copyright{ color:#999; font-size:12px; padding:50px 0;}
.footer img.platform{ width: 80%; max-width: 800px;}
.footer .link{ padding-top:40px; width: 90%; margin: 0 auto;}
.footer .sns{ padding-bottom:30px;}
.footer .sns img{ margin:0 5px;}

.footer .banner a img{ width:30%; max-width:600px; margin-bottom:40px;}
.footer .banner a:hover img{ box-shadow:0 0 12px #fc0;}

.slider { width: 100%; max-width:1000px; margin: 30px auto 80px!important; }
.slick-slide { margin: 0px 20px; }
.slick-slide img { width: 100%;}
.slick-prev:before, .slick-next:before { color: #666!important; }
.slick-dots li button:before { color:#666!important;}

.spec .buy { text-align:center;}
.spec .buy img{ width:45%; right:0; top:40px; max-width:235px; padding:1%; }
.rights_mark{ height: 15px; padding: 0 2px 5px; opacity: 0.7;}

.shop{ background-color:#190712; padding-top:50px;}
.shop .inner{ text-align:center; margin:0 auto; max-width:1200px; width:98%;}
.shop h3{ color: #ff6e00; font-size: 270%; letter-spacing: -0.03em; width: 99.2%; margin: 0 auto ; line-height: 1; padding: 25px 0; border: dotted 1px rgba(255, 216, 0, 0.58); border-radius: 8px; background-color: #000;}
.shop .inner ul{ list-style:none; color:#FFF; padding-top:5px; display: flex; flex-wrap: wrap;}
.shop .inner li{ width:32.7%; border: dotted 1px #776200; display: inline-block; border-radius: 10px; margin: 0.25%; background-color: #000;}
.shop .inner li img.chara{ width: 90%; display: block; margin: 0 auto 20px;}
.shop .inner li a img.btn{ width: 60%; display: block; margin: 0 auto 10%; border-radius: 5px;}
.shop .inner li a:hover img.btn{ box-shadow:0 0 15px #fc0;}
.shop .inner li h5{ padding: 5% 0; color: #ff6e00; font-size: 140%;}
.shop .inner li span{ display:block; font-size:75%; padding-top: 2px; padding-bottom:5%;}
.shop .inner .notice{ text-align: left; color: #d2cece; width: 97%; padding: 10px 0 40px; font-size: 67%; margin-bottom: 0;}

/* popup */
.popup-image img{
    width: 100%;
}
@media screen and (max-width: 550px){
    .modaal-container{height: calc(100vw - 50px)!important;}
}

/* web-manual */
.web-manual_container{
    position: fixed;
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.web-manual_link_wrap{
    display: flex;
    flex-direction: column;
    width: 70%;
    gap: 2em;
    text-align: center;
}

.web-manual_link img{
    width: 100%;
}

.modaal-container{
    background: rgba(0, 0, 0, 0)!important;
}

@media screen and (min-width: 640px) {

.hidepc{ display:none;}
.header{ font-size:12px;}
.box{ width:100%; margin:0 auto;}
.box a img{ margin:0 2.5px 5px; width: 24%; max-width: 300px; border-radius: 5px;}
.box a:hover img{ box-shadow:0 0 15px #fc0; width: 24%; margin:0 2.5px 5px; border-radius: 5px;}
.box2 img{ margin:0 2.5px 25px; width: 48%; max-width: 300px; border-radius: 5px;}
.box2 a:hover img{ box-shadow:0 0 15px #fc0; width: 48%; margin:0 2.5px 25px; border-radius: 5px;}
.box3 img{ margin:0 2.5px 5px; width: 21%; max-width: 300px; border-radius: 5px;}
.box3 a:hover img{ box-shadow:0 0 15px #fc0; width: 21%; margin:0 2.5px 5px; border-radius: 5px;}

.p4k{ margin:40px 0 0;}
.p4k img{ width:48%;}
.p4k h2{}
.p4k h5{ color: #171616; padding: 10px 0 10px; border-bottom: none; margin-bottom: 15px; font-size: 129%; font-weight: 600;}
}




@media screen and (max-width: 639px) {

.hidesp{ display:none;}
.header{ font-size:2vw;}
.box{ width:100%; margin:0 auto;}
.box a img, .box2 a img{ margin:0 2.5px 5px; width: 46%; max-width: 300px;}
.box3 a img{ margin:0 2.5px 5px; width: 40%; max-width: 300px;}
.box3 img{ margin:0 2.5px 5px; width: 40%; max-width: 300px;}
.box img, .box2 img{ margin:0 2.5px 5px; width: 46%; max-width: 300px;}
.box a:hover img, .box2 a:hover img{ box-shadow:0 0 15px #fc0; width: 46%; margin:0 2.5px 5px;}
.box3 a:hover img{ box-shadow:0 0 15px #fc0; width: 40%; margin:0 2.5px 5px;}

.shop .inner li{ width:49.5%;}
.shop .inner li h5{ font-size:100%;}
.shop h3 {font-size:160%;}
.news{ font-size: 90%; padding: 2% 4%;}
.bgmov{ padding:0;}
.movnews{ text-align:center; color:#FFF; padding:10px 0;}
.news img.tenp{ width: 18vw; top: 40px; right: 20px;}

.main{ display:none;}
.main_tb{ display:none;}
.main_sp img{ width:100%;}

.content{ padding:5%;}
.content h2{ font-size:223%; line-height:1.3; margin-bottom: 10px;}
.content h3 img{ margin: 0 auto}
.content h4{ line-height:1.3; font-size:120%; padding-top:10%; padding-bottom: 4%;}
.content p{ font-size:100%; width: 90%; margin: 0 auto 0px; text-align: left; line-height: 1.8; padding-bottom: 0;}
.content .box{ padding:10px 0 30px 0;}
.content .box img.slogo{ width:42%; padding:1%;}

.content .inner .boximg2 { padding-top:30px;}
.content .inner .boximg2 .notice{ margin-bottom:20px;}

.content ul{ margin:0px auto 0;}
.content li{ width:100%; padding-bottom: 30px;}
.content li h3 { font-size: 100%; margin-bottom:0px; width:100%;}
.content li h4 { font-size: 90%; width: 90%; margin: 5px auto 0; line-height:1.5;}
.content li img{ padding-bottom:0;}
.content .dlc_cloth { margin: 0px auto 20px; text-align:left; font-size:100%;}
.content .dlc_cloth h4{ text-align:center; font-size: 120%;}
.content2 h3{ font-size:160%;} 
.content .inner h5{ left:38%; top:-2%;}
.content .inner .boximg h3{ font-size:190%;}

.content3{ padding:20px 0;}
.content3 h3{ font-size:223%; line-height:1.3; margin-bottom: 10px;}
.content3 h3 img{ margin: 0 auto}
.content3 p{ font-size:90%; width: 90%; margin: 0 auto 40px; text-align: left; line-height: 1.8; padding-bottom: 0;}
.content3 .box{ padding:10px 0 30px 0;}
.content3 .box img.slogo{ width:42%; padding:1%;}
.content3 li{ width:49.5%; padding-bottom: 30px;}
.content3 li h3 { font-size: 80%; margin-bottom:15px;}
.content3 li h4 { width: 73%; margin: 5px auto 0;}
.content3 .dlc_cloth { margin: 0px auto 20px; text-align:left; font-size:90%; color:#ccc; width:90%;}
.content3 .dlc_cloth h4{ font-size: 120%;}

.get_dlc { margin:0px}
.get_dlc h3{ font-size: 150%; width: 90%; padding: 30px 0 0;}
.get_dlc h4{ font-size:90%; }

.slick-next { right: 0px; display: none!important;}

.spec{ font-size: 90%;}
.spec .inner{ padding:20px 0 20px; margin:0 auto;}
.spec .inner dd { margin-left: 6em;}
.spec a img.buy{ }
.spec .inner { padding: 20px 0 20px;}

.footer{ padding: 10px 0;}
.footer .link{ font-size:75%;}
.footer .copyright{ font-size:67%;}
.footer .banner a img{ width:90%;}

.notice{ margin: 11px auto 70px;}
}


@media screen and (min-width: 640px) {
.main{ background-image:url(../img/main.jpg); height:780px; background-position:top center; position:relative; background-repeat:no-repeat; background-color:#000;}
.main .switch_logo{ position: absolute; right: 3%; top: 30px; text-align:right;}
.main .switch_logo img{ width:50%;}
.main .main_inner{ margin:0 auto; width:90%; max-width:1057px; position:relative; text-align:center;}
.main .main_inner h1{ text-align:center;}
.main .main_inner h1 img{ width:100%; max-width:690px;}
.main .main_inner h2{ text-align:center; padding: 60px 0;}
.main .main_inner .sengoku15th{ position: absolute; top: 30px; left:0px;}
.main .main_inner .date{ font-size: 380%; color: #fff; font-weight: 700; text-shadow: 0 0 14px #000;}
.main .main_inner .date span{ font-size:65%;}
.main .top-bnr_wrap{display: flex; position:absolute; width: min(20vw,250px); right:3%; bottom:25px; flex-direction: column; gap: min(1vw,15px) 0; z-index: 5;}
.top-bnr img{width: 100%;}
.main_tb{ display:none;}
.main_sp{ display:none;}
}

@media screen and (max-width: 768px) and (min-width: 640px) {
.get_dlc h3{ font-size:230%;}
.content li{ width:49.5%;}
.content p{ font-size:123%;}
.content .inner h5{ left:43%; top:-3.5%;}
.AccordionPanelContent .dlcimg{ width:24.5%!important;}
.AccordionPanelContent .dlcimg2{ width:24.2%!important;}
.AccordionPanelContent .dlcimg3{ width:auto!important;}
.news img.tenp{ width: 15vw; top: -22px; right: 10px;}
}


#dlcItems2 .AccordionPanel { margin: 0 auto 0px; padding: 0; width: 100%; border: solid 1px #b90d0d; border-radius: 0px; max-width:100%; background-color:#FFF; box-shadow:0 0 5px; background-image:url(../img/bg_ud.jpg)}

.Accordion { overflow: hidden;}
.AccordionPanel { margin: 0 auto 40px; padding: 0; width: 95%; border: solid 1px #b90d0d; border-radius: 10px; max-width:1200px; background-color:#FFF; box-shadow:0 0 5px;}
.AccordionPanelTab { cursor: pointer; -moz-user-select: none; -khtml-user-select: none; padding: 2% 0px; color: #b91212; font-size: 130%; font-weight: bold; text-align:center; border-radius: 8px; background-image: url(/vrsense/img/plus.gif); background-repeat:no-repeat; background-position:right;}
.AccordionPanelTab span{ position: absolute; width: 32px; height: 5px; background-image: url(../story/new.png); margin-left: 10px;}
.AccordionPanelContent { overflow: hidden; margin: 0 auto; height: auto; width: 90%; color: #222; line-height: 140%; padding: 0 5% 3% 5%;}
.AccordionPanelContent .text{ width: 100%; float: left; font-size: 95%;}
/*.AccordionPanelContent .text span{ font-weight: bold; padding: 10px 0; display: block; color: #b01cda; font-size: 120%; line-height: 1.4; border: solid 4px #d981f3; background-color: #f7b6f3; margin-bottom: 20px;}*/
.AccordionPanelContent .text .photo{ margin-top: 10px; margin-bottom:15px;}
.AccordionPanelContent .text .photo img{ margin-left: 25px; width: 100%; max-width: 400px; float: right; border: solid 6px #ffffff; box-shadow: 2px 2px 12px #555;}
.AccordionPanelContent .text .photo3 img{ margin-right:25px; width: 100%; max-width: 400px; float:left; border:solid 6px #ffffff; box-shadow:2px 2px 12px #555;}
.AccordionPanelContent .text .partytext{ display:block; line-height:1.5;}
.AccordionPanelOpen .AccordionPanelTab { background-image: url(/vrsense/img/minus.gif); padding: 2% 0px; font-size: 130%; color: #b91212; font-weight: bold; background-repeat: no-repeat; background-position: right;}
.AccordionPanelTabHover { color: #222;}
.AccordionPanelOpen .AccordionPanelTabHover { color: #222;}
.AccordionFocused .AccordionPanelTab { background-color: #3399FF;}
.AccordionFocused .AccordionPanelOpen .AccordionPanelTab { background-color: #33CCFF;}

.AccordionPanelContent .text h3{ color:#ca0000; padding:20px 0 10px; border-bottom: dotted 1px; margin-bottom: 15px; font-size: 150%;}
.AccordionPanelContent .text dl{ padding:0px 0; float: left; font-size:95%;}
.AccordionPanelContent .text dl.leftside{ width:100%;}
.AccordionPanelContent .text dl.rightside{ width:47%; margin-left:3%;}
.AccordionPanelContent .text dt{ display:inline-block; float:left;}
.AccordionPanelContent .text dd{display: block; text-indent: 0em; padding-bottom:10px; color: #d21e1e;}
.AccordionPanelContent .text dt a{ color:#444; text-decoration:none;}
.AccordionPanelContent .text dt a:hover{ color:#f00; text-decoration:underline;}
.AccordionPanelContent .notice{ font-size:80%; padding-top:7px; color: #f9bbbb;}
.AccordionPanelContent .notice2{ font-size:85%; padding-top:7px; color: #555; margin:30px 0; padding-top:15px; border-top:solid 1px #555;}

.AccordionPanelContent .dlcimg{ float:left; width:12.5%; text-align:center;}
.AccordionPanelContent .dlcimg img, .AccordionPanelContent .dlcimg3 img{ height:200px;}
.AccordionPanelContent .dlcimg2{ display:inline-block; width:24.5%; text-align:center; margin-right:0.2%; vertical-align:top;}
.AccordionPanelContent .dlcimg2 img{ width:100%;}
.AccordionPanelContent .dlcimg3{ float:left; text-align:center;}
.AccordionPanelContent .dlcimg span, .AccordionPanelContent .dlcimg2 span, .AccordionPanelContent .dlcimg3 span{ display:block; font-size:90%; padding:10px 0 15px; line-height:1.3;}


@media screen and (max-width: 639px) {
.AccordionPanel{ margin:0 auto 0;}
.AccordionPanelContent .text{ width: 100%; float: left; font-size: 90%; padding-bottom:20px;}
.AccordionPanelContent .text dl{ padding:0px 0 0;}
.AccordionPanelContent .text dl.leftside{ width:100%;}
.AccordionPanelContent .text dl.rightside{ width:100%; margin-left:0;}
.AccordionPanelContent { overflow: hidden; margin: 0 auto; height: auto; width: 95%; color: #222; line-height: 140%; padding: 3% 2%;}
.AccordionPanelContent .text dl{ font-size:95%;}
.AccordionPanelContent .text dt{ display:inline-block; }
.AccordionPanelContent .text dd{display: block; margin-left: 0em; padding-bottom:10px;}
.testcatch{ color: #ff0; margin-bottom: 10px; font-weight:bold; font-size:110%; line-height:1.4;}
.AccordionPanelTab{ font-size:100%; padding:5% 0 ;}
.AccordionPanelOpen .AccordionPanelTab{ padding:5% 0; font-size:100%;}

.AccordionPanelContent .dlcimg, .AccordionPanelContent .dlcimg2{ width:31.5%;}
.AccordionPanelContent .dlcimg3{ float:left; text-align:center; width:50%;}

.content2 .pak .box2 { width: 100%; float: none; padding-bottom:30px;}

#done{ padding-top:30px;}
#done ul{ list-style:none;}
#done li{ width: 100%; text-align: center; float: left; margin: 0 0.5% 8%; line-height:1.3;}
#done li h5{ padding-top: 10px; font-size: 14px; font-weight: bold;}
#done li p{ margin:5px auto 15px; padding:0; font-size:12px; line-height:135%; text-align:left; color:#666; width:97%;}
#done li img{ width:100%;}

.p4k{ margin:40px 0 0;}
.p4k img{ width:100%;}
.p4k h2{}
.p4k h5{ color: #171616; padding: 10px 0 10px; border-bottom: none; margin-bottom: 15px; font-size: 129%; font-weight: 400;}

}

