@charset "UTF-8";
#debug {z-index: 999;position: absolute;bottom: 0;right: 0;padding: 5px;background: #666;opacity: 0.8;display: none;}
/* --------------------------------
reset
-------------------------------- */
html,body,p,h1,h2,h3, table,th,td,ul,li,dl,dt,dd, address, menu, fieldset, legend, label {margin: 0; padding: 0;}
dt,dd,li,h1,h2,h3,h4,h5,h6,pre,code,form,input,button,textarea,p,th,td,address, label, legend {font-family:Verdana,"Hiragino Kaku Gothic ProN","メイリオ","ＭＳ Ｐゴシック",sans-serif;font-size:12px;line-height:1.4;}

li {list-style: none;}
img {border: 0;}
a {text-decoration: none;}
table {border-collapse: collapse;}
address {font-style: normal;}

header,
img {
-ms-interpolation-mode: nearest-neighbor;	/* IE8+ */
image-rendering: -webkit-optimize-contrast;	/* Safari (WebKit) */
image-rendering: -moz-crisp-edges;			/* Firefox (Gecko) */
image-rendering: -o-crisp-
edges;			/* Opera 12.x */
image-rendering: pixelated;					/* Chrome 41+, Opera 29+ (CSS4) */
}
/* ----------------------------- */
#test:after {content:"基本320以下";}
body {padding-top: 10px;background: #FFF5;}
/* ---------------------------- */
html,body{height:100%;}
.wrap {margin: 0 auto;padding: 0 10px;width: 100%;position: relative;/*min-height: 100%;*/}
.box {margin-top: 15px;}
.inner {padding: 0 10px 10px 10px;border: 4px solid #000;border-radius: 4px;background: #FFF;}
.inner:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}
.inner p {padding-top: 10px;}
.inner h2 {padding-top: 70px;}
.inner h2.contTop {padding-top: 30px;}
/* .bubble */
h1.bubble {float: left;}
h1.bubble, h2.bubble { padding-top: 0;}
h1.bubble, h2.bubble { padding-bottom: 0; overflow: hidden;}
h1.bubble, h2.bubble { position: relative; left: -10px; height: 58px;}
h1.bubble strong, h2.bubble strong {position: relative;display: block;float: left;border: 2px solid #000;border-radius: 50px;background: #FFF;}
h1.bubble strong, h2.bubble strong {top: -25px;left: -10px;padding: 35px 28px 15px 28px;}
h1.bubble strong { background: #C00; color: #FFF; font-size: 14px; line-height: 18px;}
h2.bubble strong { background: #FF3;}
h1.bubble strong:after, h2.bubble strong:after {content: "";display: block;position: absolute;left: 30px;bottom: -7px;width: 9px;height: 9px;border: 2px solid #000;border-top: none;border-left: none;-moz-transform: rotate(45deg);-webkit-transform: rotate(45deg);transform: rotate(45deg);background: #FFF;}
h1.bubble strong:after { background: #C00;}
h2.bubble strong:after { background: #FF3;}

h2.dome {position: relative;height: 45px;}
h2.dome strong {position: relative;display: block;float: left;border: 2px solid #000;border-radius: 50px;background: #FFF;}
h2.dome strong {padding: 10px 20px;}
h2.dome strong { background: #FF3;}
h2.dome strong:after {content: "";display: block;position: absolute;left: 30px;bottom: -7px;width: 9px;height: 9px;border: 2px solid #000;border-top: none;border-left: none;-moz-transform: rotate(45deg);-webkit-transform: rotate(45deg);transform: rotate(45deg);background: #FFF;}
h2.dome strong:after { background: #FF3;}

ul.clist {display: flex;flex-wrap: wrap;}
ul.clist li {padding: 5px 0;text-align: center;}
/* --------------------------------
-------------------------------- */
header {padding: 0 10px 10px 10px;border: 4px solid #000;border-radius: 4px;
background-color: #36F;
background-image: url(/cs/cmg/onepiece/typet/o464_sana.png);
background-repeat: no-repeat;
background-position: 100% 0;}
header:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}
#sitename {float: left;text-shadow: #000 0px -1px, #000 1px 0px, #000 0px 1px, #000 -1px 0px, #000 3px 3px;}
#sitename a {font-size: 22px;font-weight: bold;line-height: 2;}
#header a { text-decoration: none;}
#sitename a { color: #FF3;}
#sitename a:hover { background: none; color: #C00;}
header ul {float: left;}
header li {float: left;padding: 0 0 10px 5px;}
header li a {display: block;padding: 3px 10px;border-radius: 15px;background: #000;color: #FFF;}
header li a:hover {background: #C00;color: #FFF;}
header p {clear: both;border: 1px dotted #000;border-radius: 2px;padding: 5px;background: #FFF;}

/* .contents {padding-bottom: 70px;} */
.contents:after {padding-bottom: 10px;content: ".";display: block;clear: both;height: 0;visibility: hidden;}

footer {/* position: fixed;left: 0;bottom: 0;right: 0; */
height: 64px;background: #FFF;}
footer ul:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}
footer ul {margin: 5px 0 0 0;padding: 0 10px 10px 10px;border: 4px solid #000;border-radius: 4px;background-color: #36F;}
footer li {float: right;padding-top: 10px;}
footer li.crumbNav {float: left;}
footer li.contact {padding-right: 10px;}
footer li {color: #FFF;}
footer li a {color: #FFF;}
footer li a:hover {text-decoration: underline;}
/* --------------------------------
-------------------------------- */
.left-sp {float: left;}
.mr10-sp {margin-right: 10px;}
.clear_both {clear: both;}
.contTop {clear: both;}
.br_sp {display: inline;}
/* --------------------------------
-------------------------------- */

.box input {margin-top: 4px;padding: 4px 8px;}
.box .button {padding: 12px 25px;border: none;border-radius: 50px;background: #000;color: #FFF;}
.box .button:hover {background-color: #F60;}
.box select {padding: 4px 8px;}
.box a:link {color: #F33;}
.box a:hover {text-decoration: underline;}
.box a:visited {color: #C00;}
.box p {padding-top: 1.5em;}
.box dl.frm {width: 100%;padding-top: 0.5em;}
.box dt {padding-top: 1em;font-weight: bold;}
.box dd input.text {width: 200px;}
.box dd textarea {width: 98%;margin-top: 4px;}
.box dd label {padding-right: 10px;white-space: nowrap;}

#scripcopyright {width: 220px;padding-top: 20px;}
#scripcopyright dt {display: none;}

.ad {clear: both;padding-top: 20px;}
/* --------------
.cngNav
-------------- */
.contents dl.cngNav {float: right;}
.cngNav dt {font-size: 16px;line-height: 1.2;text-align: center;}
.cngNav dd {float: left;width: 75px;margin-top: 5px;padding: 2px;border: 1px solid #000;text-align: center;border-radius: 1px;}
.cngNav dd img {vertical-align: bottom;}
.cngNav dd.icN { background: #FFF;}
.cngNav dd.icB { border-left: none; background: #000;}
.cngNav dd:hover { background: #C00;}
.cngNav dt span, .cngNav dd {cursor: pointer;}

@media screen and (min-width: 320px) {/*#test1:after {content:" 320以上";}*/.wrap {width: 300px;}}
@media screen and (min-width: 360px) {/*#test1:after {content:" 360以上";}*/.wrap {width: 340px;}
header {background-position: 100% 50%;}
#sitename {float: left;}
#sitename a { color: #FF3;}
header ul {padding: 10px 0 0 5px;}
header p {clear: both;border: 1px dotted #000;border-radius: 2px;padding: 5px;background: #FFF;}
}
@media screen and (min-width: 480px) {/*#test1:after {content:" 480以上";}*/.wrap {width: 460px;}}
@media screen and (min-width: 768px) {/*#test1:after {content:" 768以上";}*/.wrap {width: 748px;}
dt,dd,li,h1,h2,h3,h4,h5,h6,pre,code,form,input,button,textarea,p,th,td,address{font-size:14px;}
header {background-image: url(/cs/cmg/onepiece/typet/o464_sana.png);background-position: 100% 50%;}
#sitename a {font-size: 24px;}
header p {float: left;}

.box {}
.colall {width: 100%;}
.col1 {width: 29%;float: right;}
.col2 {width: 69.5%;float: left;}
.left {float: left;}
.right {float: right;}
.left-sp {float: none;}
.br_sp {display: none;}

dl.cngNav {padding-top: 5px;}
.cngNav dt {float: left;padding: 4px 10px 0 0;font-size: 24px;}
.cngNav dd {float: left;width: auto;}

.box dl.frm {width: 90%;}
.box dd textarea {width: 75%;}

.innerCol {clear: both;}
.innerCol:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}
.innerCol2 {width: 50%;}
}
@media screen and (min-width: 800px) {/*#test1:after {content:" 800以上";}*/.wrap {width: 780px;}}
@media screen and (min-width: 980px) {/*#test1:after {content:"980以上";}*/.wrap {width: 960px;}
header {background-position: 100% 0;background-size: 192px 160px;}
}
/* @media screen and (min-width: 1024px) {#test1:after {content:"1024以上";}.wrap {width: 970px;}} */
