@charset "utf-8";

/*
font-size = 12px
line-height = 18px
text = #1a1a1a
*/

/* for debug */
body.preview { width:320px !important; margin:0 auto 0 auto !important; border:1px solid #cccccc;}

/***** reset *****/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,em,img,strong,dl,dt,dd,ol,ul,li,form,label,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,dialog,figure,figcaption,footer,header,hgroup,menu,nav,section,time,mark,audio,video {
color:#1a1a1a; margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; list-style-type:none; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-style:normal; line-height:1.4; word-break:break-all; }
img { vertical-align:top;  }
select,input,textarea { font-size:12px; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }
article,aside,dialog,div,figure,footer,header,hgroup,nav,section { display:block;  }
html { -webkit-text-size-adjust:100%; }
body { font-size:12px; }
a { color:#1a1a1a; text-decoration:underline; }
a:hover { color:#1a1a1a; text-decoration:underline; }
/* android: disable orange outline highlight on focus */
* { -webkit-tap-highlight-color:rgba(255, 255, 255, 0); -webkit-tap-highlight-color:transparent; }

/**** for iOS ****/
a { -webkit-touch-callout:none; /*-webkit-user-select:none;*/ }

/***** form *****/
input[type="text"],input[type="password"] { border:1px solid #cccccc; outline:none; background:#ffffff none 0 0 no-repeat; height:30px; /*line-height:30px;*/ padding:0 0.3em; box-sizing:border-box; }
/*input[type="text"]:hover,input[type="text"]:focus,input[type="password"]:hover,input[type="password"]:focus { border:1px solid #cccccc; background:#f6f6f6 none 0 0 no-repeat; }*/
select { border:1px solid #cccccc; background:#ffffff none 0 0 no-repeat; outline:none; padding:2px; outline:none; }
select:hover,select:focus { border:1px solid #cccccc;  }
input[type="text"].ime-disabled, text.ime-disabled { ime-mode:disabled; }
input[type="text"].r,input[type="password"].r { border-radius:4px; }
input[type="text"].r10,input[type="password"].r10 { border-radius:10px; }
input[type="checkbox"],input[type="radio"] { line-height:20px; }
textarea { border:1px solid #cccccc; outline:none; background:#ffffff none 0 0 no-repeat; }
input::-ms-clear { visibility:hidden; }

/***** layout *****/
.font-xsmall { font-size:8px !important; }
.font-small { font-size:10px !important; }
.font-normal { font-size:12px !important; }
.font-large { font-size:14px !important; }
.font-xlarge { font-size:16px !important; }
.font-weight-bold { font-weight:bold !important; }
.font-weight-normal { font-weight:normal !important; }
.font-red { color:#fe0000 !important; }
.font-gray { color:#999999 !important; }
a.no-underline { text-decoration:none !important; }
a.no-underline:hover { text-decoration:underline !important; }
a.nu { text-decoration:none !important; }
a.nu:hover { text-decoration:underline !important; }
.tl { text-align:left !important; } .tr { text-align:right !important; } .tc { text-align:center !important; }
.vl { vertical-align:left !important; } .vr { vertical-align:right !important; } .vm,.vc { vertical-align:middle !important; }
.fl { float:left !important; } .fr { float:right !important; }
.clear { clear:both; zoom:1; } .clear:after { content:''; display:block; clear:both; }
.nr { white-space:nowrap !important; }
.of { overflow:hidden; }
.pr { position:relative; }
.inline-box { display:inline-block; }
.cursor-default { cursor:default !important; }
.fs10{ font-size:10px !important; } .fs11{ font-size:10px !important; } .fs12{ font-size:12px !important; } .fs13{ font-size:13px !important; } .fs14{ font-size:14px !important; } .fs15{ font-size:15px !important; } .fs16{ font-size:16px !important; }
.fs80p { font-size:80% !important; } .fs85p { font-size:85% !important; } .fs90p { font-size:90% !important; } .fs100p { font-size:100% !important; } .fs110p { font-size:110% !important; } .fs120p { font-size:120% !important; } .fs130p { font-size:130% !important; } .fs140p { font-size:140% !important; } .fs150p { font-size:150% !important; } .fs160p { font-size:160% !important; }
.small { font-size:10px; }
.xsmall { font-size:8px; }
.mb0 { margin-bottom:0px !important; } .mb5 { margin-bottom:5px !important; } .mb10 { margin-bottom:10px !important; } .mb15 { margin-bottom:15px !important; } .mb20 { margin-bottom:20px !important; } .mb30 { margin-bottom:30px !important; } .mb40 { margin-bottom:40px !important; } .mb50 { margin-bottom:50px !important; } .mb60 { margin-bottom:60px !important; } .mb70 { margin-bottom:70px !important; } .mb80 { margin-bottom:80px !important; } .mb90 { margin-bottom:90px !important; } .mb100 { margin-bottom:100px !important; } .mb110 { margin-bottom:110px !important; } .mb120 { margin-bottom:120px !important; } .mb130 { margin-bottom:130px !important; } .mb140 { margin-bottom:140px !important; } .mb150 { margin-bottom:150px !important; } .mb160 { margin-bottom:160px !important; } .mb170 { margin-bottom:170px !important; } .mb180 { margin-bottom:180px !important; } .mb190 { margin-bottom:190px !important; } .mb200 { margin-bottom:200px !important; }
.mt0 { margin-top:0px !important; } .mt5 { margin-top:5px !important; } .mt10 { margin-top:10px !important; } .mt15 { margin-top:15px !important; } .mt20 { margin-top:20px !important; } .mt30 { margin-top:30px !important; } .mt40 { margin-top:40px !important; } .mt50 { margin-top:50px !important; } .mt60 { margin-top:60px !important; } .mt70 { margin-top:70px !important; } .mt80 { margin-top:80px !important; } .mt90 { margin-top:90px !important; } .mt100 { margin-top:100px !important; } .mt110 { margin-top:110px !important; } .mt120 { margin-top:120px !important; } .mt130 { margin-top:130px !important; } .mt140 { margin-top:140px !important; } .mt150 { margin-top:150px !important; } .mt160 { margin-top:160px !important; } .mt170 { margin-top:170px !important; } .mt180 { margin-top:180px !important; } .mt190 { margin-top:190px !important; } .mt200 { margin-top:200px !important; }
.ml3 { margin-left:3px !important; } .ml5 { margin-left:5px !important; } .ml10 { margin-left:10px !important; }
.mr3 { margin-right:3px !important; } .mr5 { margin-right:5px !important; } .mr10 { margin-right:10px !important; }
.mlr-auto { margin-left:auto !important; margin-right:auto !important; }
.p5 { padding:5px !important; } .p10 { padding:10px !important; } .p15 { padding:15px !important; } .p20 { padding:20px !important; }
.w10 { width:10px !important; } .w20 { width:20px !important; } .w30 { width:30px !important; } .w40 { width:40px !important; } .w50 { width:50px !important; } .w60 { width:60px !important; } .w70 { width:70px !important; } .w80 { width:80px !important; } .w90 { width:90px !important; }
.w100 { width:100px !important; } .w110 { width:110px !important; } .w120 { width:120px !important; } .w130 { width:130px !important; } .w140 { width:140px !important; } .w150 { width:150px !important; } .w160 { width:160px !important; } .w170 { width:170px !important; } .w180 { width:180px !important; } .w190 { width:190px !important; } .w200 { width:200px !important; } .w210 { width:210px !important; } .w220 { width:220px !important; } .w230 { width:230px !important; } .w240 { width:240px !important; } .w250 { width:250px !important; } .w260 { width:260px !important; } .w270 { width:270px !important; } .w280 { width:280px !important; } .w290 { width:290px !important; } .w300 { width:300px !important; } .w400 { width:400px !important; } .w500 { width:500px !important; } .w600 { width:600px !important; } .w700 { width:700px !important; } .w800 { width:800px !important; } .w900 { width:900px !important; }
.w145 { width:145px !important; } .w155 { width:155px !important; }
.w320 { width:320px !important; }
.w10p { width:10% !important; } .w20p { width:20% !important; } .w25p { width:25% !important; } .w30p { width:30% !important; } .w40p { width:40% !important; } .w45p { width:45% !important; } .w50p { width:50% !important; } .w60p { width:60% !important; } .w70p { width:70% !important; } .w80p { width:80% !important; } .w90p { width:90% !important; } .w100p { width:100% !important; }
.h10 { height:10px !important; } .h20 { height:20px !important; } .h30 { height:30px !important; } .h40 { height:40px !important; } .h50 { height:50px !important; } .h60 { height:60px !important; } .h70 { height:70px !important; } .h80 { height:80px !important; } .h90 { height:90px !important; }
.h100 { height:100px !important; } .h110 { height:110px !important; } .h120 { height:120px !important; } .h130 { height:130px !important; } .h140 { height:140px !important; } .h150 { height:150px !important; } .h160 { height:160px !important; } .h170 { height:170px !important; } .h180 { height:180px !important; } .h190 { height:190px !important; } .h200 { height:200px !important; } .h210 { height:210px !important; } .h220 { height:220px !important; } .h230 { height:230px !important; } .h240 { height:240px !important; } .h250 { height:250px !important; } .h260 { height:260px !important; } .h270 { height:270px !important; } .h280 { height:280px !important; } .h290 { height:290px !important; } .h300 { height:300px !important; } .h400 { height:400px !important; } .h500 { height:500px !important; } .h600 { height:600px !important; } .h700 { height:700px !important; } .h800 { height:800px !important; } .h900 { height:900px !important; }
.h100p { height:100%; }


/**** debug-tool ****/
#debug-tool { position:fixed; bottom:0; left:0; width:100%; z-index:1000; }
#debug-tool a { display:inline-block; position:absolute; bottom:10px; right:10px; height:20px; background-color:#333333; padding:2px 4px 2px 4px; border-radius:2px; color:#ffffff; text-decoration:none; font-size:10px; line-height:20px; opacity:0.5; filter:alpha(opacity=50); }
#debug-tool a:hover { opacity:1.0; filter:alpha(opacity=100); }

/**** contents ****/
body { background-color:#ffffff; }
.contents { position:relative; }
section.content {}
section.content.paragraph { margin:15px 15px 15px 15px; line-height:1.7; }
section.content.list { margin:15px 0 15px 15px; }

/**** parts: btn ****/
.btn { display:inline-block; font-size:12px; line-height:25px; letter-spacing:1px; margin:0; padding:6px 12px 4px 12px; text-align:center; vertical-align:middle; cursor:pointer; background-color:#ffffff; color:#1a1a1a; border:1px solid #cccccc; outline:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
a.btn { text-decoration:none; }
.btn.primary { color:#ffffff; text-shadow:0 -1px 0 rgba(0,0,0,0.25);  background-color:#1a1a1a; border:1px solid #1a1a1a; }
.btn.invalid { opacity:0.2; filter:alpha(opacity=20); }
.btn.small { font-size:12px; line-height:20px; padding:3px 6px 2px 6px; }
.btn.micro { font-size:10px; line-height:15px; padding:2px 3px 1px 3px; }
ul.btns > li { display:inline; }



/**** parts: label ****/
.label { box-sizing:border-box; display:inline-block; padding:3px 6px 4px 6px; font-size:12px; font-weight:normal; line-height:14px; color:#ffffff; vertical-align:baseline; text-align:center; white-space:nowrap; background-color:#999999; }
.label.small { padding:2px 4px 2px 4px;font-size:10px; line-height:12px; }
.label.valid { background-color:#0088cc; }
.label.invalid,label.disabled { background-color:#999999; }
.label.gray { background-color:#999999; }
.label.blue { background-color:#0283c7; }
.label.green { background-color:#468847; }
.label.red { background-color:#dd1144; }
.label.orange { background-color:#faa732; }
.label.black { background-color:#333333; }
.label.fill { display:block; text-align:center; }

/**** parts: alert ****/
div.error,div.message { margin:30px 15px 30px 15px; padding:0; }
div.error strong, div.message strong { font-weight:bold; text-shadow:0 1px 1px rgba(255, 255, 255, 0.5); }
div.error ul, div.message ul { margin:8px 0 0 10px; }
div.error ul li, div.message ul li { margin:0 0 4px 10px; list-style-type:disc; }
div.error { color:#fe0000; }
div.error strong,div.error ul li { color:#fe0000; }
div.message { color:#1a1a1a; }
div.message strong,div.message ul li { color:#1a1a1a; }


/**** parts : header ****/
header { margin:0 0 10px 0; padding:0; position:relative; }
header > div.logo { margin:15px 0 20px 15px; width:139px; height:27px; }
header > div.logo > a { display:block; width:139px; height:27px; text-indent:-9999px; background:url(../images/common/logo.gif) center left no-repeat; background-size:139px 27px; -webkit-background-size:139px 27px; -moz-background-size:139px 27px; }
header > h1 { font-size:12px; font-weight:bold; margin:0; padding:0 0 10px 15px; border-bottom:1px solid #cccccc; }
header > div.shortcut { position:absolute; bottom:10px; right:8px; }

/**** parts : footer ****/
footer { margin:60px 0 10px 0; padding:0; position:relative; }
footer > hr { height:1px; border:none; border-top:1px solid #cccccc; margin:0 0 10px 0; }
footer > ul { display:block; width:100%; text-align:center; }
footer > ul > li { display:inline-block; margin:0 0 0 10px; }
footer > div { padding:15px 0 0 15px; font-size:10px; color:#444444; text-align:center; }





/**** parts : heading ****/
h1.heading {}

/**** parts : list ****/
ul.list { margin:0; padding:0; }
ul.list.border-top { border-top:1px solid #cccccc; }
ul.list > li { display:table; width:100%; border-bottom:1px solid #cccccc; background-color:#ffffff; }
ul.list > li > a { display:table-cell; box-sizing:border-box; padding:15px 40px 15px 10px; vertical-align:middle; text-align:left; line-height:1.2; color:#1a1a1a; text-decoration:none; background:url(../images/common/icon-arrow-right.png) center right no-repeat; background-size:20px 10px; -webkit-background-size:20px 10px; -moz-background-size:20px 10px; }
ul.list > li > div { display:table-cell; box-sizing:border-box; padding:15px 40px 15px 10px; vertical-align:middle; text-align:left; line-height:1.2; position:relative; }
ul.list > li > div div.value { position:absolute; top:15px; right:10px; width:250px; text-align:right; }

/**** parts : form ****/
dl.field { margin:0 0 15px 0; padding:0 0 15px 0; width:100%; display:table; border-bottom:1px solid #cccccc; background-color:#ffffff; }
dl.field > dt { width:150px; display:table-cell; text-align:left; vertical-align:middle; padding:0 0 0 10px; }
dl.field > dd { display:table-cell; text-align:left; vertical-align:middle; padding:0 10px 0 0; }

/**** parts : pager ****/
ul.pager {}
ul.pager > li { display:inline; }
ul.pager > li > a, ul.pager > li > span { display:inline-block; text-decoration:none; width:25px; font-size:11px; line-height:20px; margin:0; padding:3px 0 2px 0; text-align:center; vertical-align:middle; cursor:pointer; background-color:#ffffff; color:#1a1a1a; border:1px solid #cccccc; outline:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
ul.pager > li > span.current { background-color:#e6e7e8; cursor:default; }
ul.pager > li > span.disabled { color:#999999; cursor:default; }

/**** parts: progress ****/
#progress #progress_bg { width:100%; height:100%; background-color:#000000; opacity:0.5; position:fixed; top:0; left:0; z-index:1001; }
#progress #progress_dialog { width:80px; height:80px; position:fixed; top:0; left:0; z-index:1002; }
#progress #progress_dialog span.indicator { position:absolute; top:40px; left:40px; z-index:1003; }

/**** layout : modal ****/
.modal-container { width:100%; height:100%; position:relative; overflow:hidden; }
body.modal-preview { background-color:#555555; }
body.modal-preview .modal-container { width:300px; margin:40px auto 40px auto; }

/**** layout : form ****/
section.content.form { margin:0; padding:15px; }
section.content.form dl {}
section.content.form dt { display:block; margin:0 0 8px 0; }
section.content.form dd { display:block; margin:0 0 20px 0; }
section.content.form .error { margin:0; padding:0; border:none; background-color:transparent; }
section.content.form .message { margin:0; padding:0; border:none; background-color:transparent; }