@charset "utf-8";

/* ------------------------------------------------------------
A-1. CSSリセット
------------------------------------------------------------ */

html,body,a,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,command,details,figcaption,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,summary,time { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; }
h1,h2,h3,h4,h5,h6,pre,em,strong,address,caption,cite,code,dfn,table,th,td,textarea,input { font-style: normal; font-weight: normal; }
article,aside,dialog,figure,figcaption,footer,header,hgroup,nav,section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
html                { overflow-y: scroll; font-size: 100%; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; }
body                { margin: 0 auto; line-height: 1; -webkit-text-size-adjust: none; }
object,embed        { vertical-align: top; outline: 0; }
button              { cursor: pointer; }
img                 { line-height: 1; vertical-align: top; text-decoration: none; -ms-interpolation-mode: bicubic; }
input,button,select { vertical-align: middle; }
textarea            { overflow: auto; vertical-align: top; }
table               { border-collapse: collapse; border-spacing: 0; }
caption,th          { text-align: left; }
strong,em,.strong   { font-weight: bold; }
abbr,acronym        { border: none; font-variant: normal; }
a:hover, a:active   { outline: 0; }
section,
section header,
section footer,
article,
article header,
article footer      { position: relative; }
ul                  { list-style: none; }










/* ------------------------------------------------------------
A-2. レイアウト関連共用
------------------------------------------------------------ */


/* 配置 */
.center             { text-align: center !important; }
.left               { text-align: left !important; }
.right              { text-align: right !important; }
.top                { vertical-align: top !important; }
.middle             { vertical-align: middle !important; }
.bottom             { vertical-align: bottom !important; }
.float-l            { float: left; }
.float-r            { float: right; }
.inline             { display: inline-block; vertical-align: top; *display: inline; *zoom: 1; }



/* まわりこみクリア */
.clear              { clear: both; }
.clearfix,.inner    { *zoom: 1; }
.clearfix:after,.inner:after { content: "."; overflow: hidden; display: block; clear: both; height: 0; visibility: hidden; }



/* 絶対位置 */
.abs                { position: absolute !important; }
.abs-tr             { position: absolute !important; top:    0; right: 0; }
.abs-br             { position: absolute !important; bottom: 0; right: 0; }
.abs-bl             { position: absolute !important; bottom: 0; left: 0; }
.abs-tl             { position: absolute !important; top:    0; left: 0; }
.abs-tc             { position: absolute !important; top:    0; left: 50%; }
.abs-bc             { position: absolute !important; bottom: 0; left: 50%; }
.rel                { position: relative !important; }



/* 表示 */
.hidden             { display: none; visibility: hidden; }



/* 改行禁止 */
.nowrap             { white-space: nowrap; }
.ellipsis           { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }



/* 汎用カラム */
.column             { display: inline-block; *display: inline; *zoom: 1; vertical-align: top; }
.col2  .column      { width: 48%; }
.col3  .column      { width: 32%; }
.col50 .column      { width: 50%; }
.col33 .column      { width: 33%; }



/* 横組レイアウト */
.pull-left          { float: left; }
.pull-right         { float: right; }
.media, .media-body { overflow: hidden; *overflow: visible; zoom: 1; }
.media, .media .media { margin-top: 15px; }
.media:first-child  { margin-top: 0; }
.media-object       { display: block; }
.media-heading      { margin: 0 0 5px; }
.media > .pull-left { margin-right: 10px; }
.media > .pull-right { margin-left: 10px; }
.media-list         { margin-left: 0; list-style: none; }



/* マージン */
.mauto              { margin-right: auto !important; margin-left: auto !important; }
.m0                 { margin: 0px !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; }
.mt25               { margin-top: 25px !important; }
.mt30               { margin-top: 30px !important; }
.mt40               { margin-top: 40px !important; }
.mt50               { margin-top: 50px !important; }
.mt-5               { margin-top: -5px !important; }
.mt-10              { margin-top: -10px !important; }
.mt-15              { margin-top: -15px !important; }
.mt-20              { margin-top: -20px !important; }
.mt-25              { margin-top: -25px !important; }
.mt-30              { margin-top: -30px !important; }
.mt-40              { margin-top: -40px !important; }
.mt-50              { margin-top: -50px !important; }
.mr0                { margin-right: 0px !important; }
.mr5                { margin-right: 5px !important; }
.mr10               { margin-right: 10px !important; }
.mr15               { margin-right: 15px !important; }
.mr20               { margin-right: 20px !important; }
.mr25               { margin-right: 25px !important; }
.mr30               { margin-right: 30px !important; }
.mr40               { margin-right: 40px !important; }
.mr50               { margin-right: 50px !important; }
.mr-5               { margin-right: -5px !important; }
.mr-10              { margin-right: -10px !important; }
.mr-15              { margin-right: -15px !important; }
.mr-20              { margin-right: -20px !important; }
.mr-25              { margin-right: -25px !important; }
.mr-30              { margin-right: -30px !important; }
.mr-40              { margin-right: -40px !important; }
.mr-50              { margin-right: -50px !important; }
.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; }
.mb25               { margin-bottom: 25px !important; }
.mb30               { margin-bottom: 30px !important; }
.mb40               { margin-bottom: 40px !important; }
.mb50               { margin-bottom: 50px !important; }
.mb-5               { margin-bottom: -5px !important; }
.mb-10              { margin-bottom: -10px !important; }
.mb-15              { margin-bottom: -15px !important; }
.mb-20              { margin-bottom: -20px !important; }
.mb-25              { margin-bottom: -25px !important; }
.mb-30              { margin-bottom: -30px !important; }
.mb-40              { margin-bottom: -40px !important; }
.mb-50              { margin-bottom: -50px !important; }
.ml0                { margin-left: 0px !important; }
.ml5                { margin-left: 5px !important; }
.ml10               { margin-left: 10px !important; }
.ml15               { margin-left: 15px !important; }
.ml20               { margin-left: 20px !important; }
.ml25               { margin-left: 25px !important; }
.ml30               { margin-left: 30px !important; }
.ml40               { margin-left: 40px !important; }
.ml50               { margin-left: 50px !important; }
.ml-5               { margin-left: -5px !important; }
.ml-10              { margin-left: -10px !important; }
.ml-15              { margin-left: -15px !important; }
.ml-20              { margin-left: -20px !important; }
.ml-25              { margin-left: -25px !important; }
.ml-30              { margin-left: -30px !important; }
.ml-40              { margin-left: -40px !important; }
.ml-50              { margin-left: -50px !important; }



/* パディング */
.p0                 { padding: 0px !important; }
.p5                 { padding: 5px !important; }
.p10                { padding: 10px !important; }
.p15                { padding: 15px !important; }
.p20                { padding: 20px !important; }
.p25                { padding: 25px !important; }
.p30                { padding: 30px !important; }
.p40                { padding: 40px !important; }
.p50                { padding: 50px !important; }
.p100               { padding: 100px !important; }
.pt0                { padding-top: 0px !important; }
.pt5                { padding-top: 5px !important; }
.pt10               { padding-top: 10px !important; }
.pt15               { padding-top: 15px !important; }
.pt20               { padding-top: 20px !important; }
.pt25               { padding-top: 25px !important; }
.pt30               { padding-top: 30px !important; }
.pt40               { padding-top: 40px !important; }
.pt50               { padding-top: 50px !important; }
.pr0                { padding-right: 0px !important; }
.pr5                { padding-right: 5px !important; }
.pr10               { padding-right: 10px !important; }
.pr15               { padding-right: 15px !important; }
.pr20               { padding-right: 20px !important; }
.pr25               { padding-right: 25px !important; }
.pr30               { padding-right: 30px !important; }
.pr40               { padding-right: 40px !important; }
.pr50               { padding-right: 50px !important; }
.pb0                { padding-bottom: 0px !important; }
.pb5                { padding-bottom: 5px !important; }
.pb10               { padding-bottom: 10px !important; }
.pb15               { padding-bottom: 15px !important; }
.pb20               { padding-bottom: 20px !important; }
.pb25               { padding-bottom: 25px !important; }
.pb30               { padding-bottom: 30px !important; }
.pb40               { padding-bottom: 40px !important; }
.pb50               { padding-bottom: 50px !important; }
.pl0                { padding-left: 0px !important; }
.pl5                { padding-left: 5px !important; }
.pl10               { padding-left: 10px !important; }
.pl15               { padding-left: 15px !important; }
.pl20               { padding-left: 20px !important; }
.pl25               { padding-left: 25px !important; }
.pl30               { padding-left: 30px !important; }
.pl40               { padding-left: 40px !important; }
.pl50               { padding-left: 50px !important; }



/* 幅 */
.w5p                { width:  5% !important; }
.w10p               { width: 10% !important; }
.w15p               { width: 15% !important; }
.w20p               { width: 20% !important; }
.w25p               { width: 25% !important; }
.w30p               { width: 30% !important; }
.w33p               { width: 33% !important; }
.w35p               { width: 35% !important; }
.w40p               { width: 40% !important; }
.w45p               { width: 45% !important; }
.w50p               { width: 50% !important; }
.w60p               { width: 60% !important; }
.w70p               { width: 70% !important; }
.w75p               { width: 75% !important; }
.w80p               { width: 80% !important; }
.w90p               { width: 90% !important; }
.w100p              { width: 100% !important; }



/* テキストインデント */
.indent1            { padding-left: 1em !important; text-indent: -1em !important; }
.indent2            { padding-left: 2em !important; text-indent: -2em !important; }
.indent3            { padding-left: 3em !important; text-indent: -3em !important; }
.indent4            { padding-left: 4em !important; text-indent: -4em !important; }
.indent5            { padding-left: 5em !important; text-indent: -5em !important; }










/* ------------------------------------------------------------
A-3. 文字
------------------------------------------------------------ */


/* 基本文字セット */
body                { background :#000; color: #555; font: 12px/1.5em '\30D2\30E9\30AE\30CE\89D2\30B4\20\50\72\6F\20\57\33', 'Hiragino Kaku Gothic Pro', Osaka, '\FF2D\FF33\20\FF30\30B4\30B7\30C3\30AF', 'Lucida Sans Unicode', Arial, helvetica, sans-serif; }
a                   { color: #555; text-decoration: underline; }
a.btn               { text-decoration: none; }
a:hover             { color: #00A8B5; text-decoration: underline; }
em                  { font-weight: bold; }
.small,small        { font-size: 10px; }
h2 small,h3 small   { font-size: 11px; }
.large              { font-size: 1.5em; }










/* ------------------------------------------------------------
A-4. アイコン、矢印、ラベル
------------------------------------------------------------ */


/* .icon */
.icon               { display: inline-block; width: 10px; height: 9px; margin: 0 0 0 2px; border: none; background: url(../img/icon.png) no-repeat; font-size: 0px !important; text-shadow: none !important; *display: inline; *zoom: 1; *line-height: 999px; *overflow: hidden; }

.icon-blank         { width: 10px; height:  9px; background-position: 0 0; }
.icon-blank4        { width:  8px; height:  7px; background-position: 0 -25px; }
.icon-blank2        { width:  8px; height:  7px; background-position: 0 -50px; }
.icon-blank3        { width:  8px; height:  7px; background-position: 0 -75px; }
.icon-search        { width: 19px; height: 16px; background-position: 0 -100px; }
.icon-rss           { width: 12px; height: 12px; background-position: 0 -150px; }
.icon-new           { width: 27px; height: 23px; background-position: 0 -200px; }
.icon-up            { width: 27px; height: 23px; background-position: 0 -250px; }
.icon-download      { width: 10px; height: 10px; background-position: 0 -300px; }
a:hover .icon-blank         { background-position: -100px 0; }
a:hover .icon-blank2,
a:hover .icon-blank3        { background-position: -100px -50px; }
a:hover .icon-search        { background-position: -100px -100px; }
a:hover .icon-rss           { background-position: -100px -150px; }
a:hover .icon-new           { background-position: -100px -200px; }
a:hover .icon-up            { background-position: -100px -250px; }
a:hover .icon-download      { background-position: -100px -300px; }



/* .arrow */
.arrow              { display: inline-block; width: 10px; height: 10px; margin: 0 3px 0 0; border: none; background: url(../img/arrow.png) no-repeat; font-size: 0px !important; text-shadow: none !important;  *display: inline; *zoom: 1; *line-height: 999px; *overflow: hidden; }

.arrow1             { width: 10px; height: 10px; background-position:    0px 0px; }
.arrow1-r           { width: 10px; height: 10px; background-position:    0px 0px; }
.arrow1-b           { width: 10px; height: 10px; background-position:  -25px 0px; }
.arrow1-l           { width: 10px; height: 10px; background-position:  -50px 0px; }
.arrow1-t           { width: 10px; height: 10px; background-position:  -75px 0px; }
.active .arrow1,   a:hover .arrow1   { background-position: -100px 0px; }
.active .arrow1-r, a:hover .arrow1-r { background-position: -100px 0px; }
.active .arrow1-b, a:hover .arrow1-b { background-position: -125px 0px; }
.active .arrow1-l, a:hover .arrow1-l { background-position: -150px 0px; }
.active .arrow1-t, a:hover .arrow1-t { background-position: -175px 0px; }

.arrow2             { width:  5px; height:  5px; background-position:    0px -50px; }
.arrow2-r           { width:  5px; height:  5px; background-position:    0px -50px; }
.arrow2-b           { width:  5px; height:  5px; background-position:  -25px -50px; }
.arrow2-l           { width:  5px; height:  5px; background-position:  -50px -50px; }
.arrow2-t           { width:  5px; height:  5px; background-position:  -75px -50px; }
.active .arrow2,   a:hover .arrow2   { background-position: -100px -50px; }
.active .arrow2-r, a:hover .arrow2-r { background-position: -100px -50px; }
.active .arrow2-b, a:hover .arrow2-b { background-position: -125px -50px; }
.active .arrow2-l, a:hover .arrow2-l { background-position: -150px -50px; }
.active .arrow2-t, a:hover .arrow2-t { background-position: -175px -50px; }

.arrow3             { width: 13px; height: 13px; background-position:    0px -100px; }
.arrow3-r           { width: 13px; height: 13px; background-position:    0px -100px; }
.arrow3-b           { width: 13px; height: 13px; background-position:  -25px -100px; }
.arrow3-l           { width: 13px; height: 13px; background-position:  -50px -100px; }
.arrow3-t           { width: 13px; height: 13px; background-position:  -75px -100px; }
.active .arrow3,   a:hover .arrow3   { background-position: -100px -100px; }
.active .arrow3-r, a:hover .arrow3-r { background-position: -100px -100px; }
.active .arrow3-b, a:hover .arrow3-b { background-position: -125px -100px; }
.active .arrow3-l, a:hover .arrow3-l { background-position: -150px -100px; }
.active .arrow3-t, a:hover .arrow3-t { background-position: -175px -100px; }

.arrow4             { width: 15px; height:  9px; background-position:    0px -150px; }
.arrow4-r           { width: 15px; height:  9px; background-position:    0px -150px; }
.arrow4-b           { width: 15px; height:  9px; background-position:  -25px -150px; }
.arrow4-l           { width: 15px; height:  9px; background-position:  -50px -150px; }
.arrow4-t           { width: 15px; height:  9px; background-position:  -75px -150px; }
.active .arrow4,   a:hover .arrow4   { background-position: -100px -150px; }
.active .arrow4-r, a:hover .arrow4-r { background-position: -100px -150px; }
.active .arrow4-b, a:hover .arrow4-b { background-position: -125px -150px; }
.active .arrow4-l, a:hover .arrow4-l { background-position: -150px -150px; }
.active .arrow4-t, a:hover .arrow4-t { background-position: -175px -150px; }

.arrow5             { width: 13px; height: 13px; background-position:    0px -200px; }
.arrow5-r           { width: 13px; height: 13px; background-position:    0px -200px; }
.arrow5-b           { width: 13px; height: 13px; background-position:  -25px -200px; }
.arrow5-l           { width: 13px; height: 13px; background-position:  -50px -200px; }
.arrow5-t           { width: 13px; height: 13px; background-position:  -75px -200px; }
.active .arrow5,   a:hover .arrow5   { background-position: -100px -200px; }
.active .arrow5-r, a:hover .arrow5-r { background-position: -100px -200px; }
.active .arrow5-b, a:hover .arrow5-b { background-position: -125px -200px; }
.active .arrow5-l, a:hover .arrow5-l { background-position: -150px -200px; }
.active .arrow5-t, a:hover .arrow5-t { background-position: -175px -200px; }

.arrow6             { width:  8px; height:  8px; background-position:    0px -250px; }
.arrow6-r           { width:  8px; height:  8px; background-position:    0px -250px; }
.arrow6-b           { width:  8px; height:  8px; background-position:  -25px -250px; }
.arrow6-l           { width:  8px; height:  8px; background-position:  -50px -250px; }
.arrow6-t           { width:  8px; height:  8px; background-position:  -75px -250px; }
.active .arrow6,   a:hover .arrow6   { background-position: -100px -250px; }
.active .arrow6-r, a:hover .arrow6-r { background-position: -100px -250px; }
.active .arrow6-b, a:hover .arrow6-b { background-position: -125px -250px; }
.active .arrow6-l, a:hover .arrow6-l { background-position: -150px -250px; }
.active .arrow6-t, a:hover .arrow6-t { background-position: -175px -250px; }

.arrow7             { width: 16px; height: 16px; background-position:    0px -300px; }
.arrow7-r           { width: 16px; height: 16px; background-position:    0px -300px; }
.arrow7-b           { width: 16px; height: 16px; background-position:  -25px -300px; }
.arrow7-l           { width: 16px; height: 16px; background-position:  -50px -300px; }
.arrow7-t           { width: 16px; height: 16px; background-position:  -75px -300px; }
.active .arrow7,   a:hover .arrow7   { background-position: -100px -300px; }
.active .arrow7-r, a:hover .arrow7-r { background-position: -100px -300px; }
.active .arrow7-b, a:hover .arrow7-b { background-position: -125px -300px; }
.active .arrow7-l, a:hover .arrow7-l { background-position: -150px -300px; }
.active .arrow7-t, a:hover .arrow7-t { background-position: -175px -300px; }



.arrow9             { width: 16px; height: 16px; background-position:    0px -344px; }
.arrow9-r           { width: 16px; height: 16px; background-position:    0px -344px; }
.arrow9-b           { width: 16px; height: 16px; background-position:  -25px -344px; }
.arrow9-l           { width: 16px; height: 16px; background-position:  -50px -344px; }
.arrow9-t           { width: 16px; height: 16px; background-position:  -75px -344px; }
.active .arrow9,   a:hover .arrow9   { background-position: -100px -300px; }
.active .arrow9-r, a:hover .arrow9-r { background-position: -100px -300px; }
.active .arrow9-b, a:hover .arrow9-b { background-position: -125px -300px; }
.active .arrow9-l, a:hover .arrow9-l { background-position: -150px -300px; }
.active .arrow9-t, a:hover .arrow9-t { background-position: -175px -300px; }



/* .label */
.label              { display: inline-block; margin: 1px 0 0 3px; padding: 2px 4px 0 4px; line-height: 1.4; vertical-align: top; border: none; background: #666; color: #fff; font-size: 11px; font-style: normal; font-weight: normal; *display: inline; *zoom: 1; }

.label1             { background: #666; color: #fff; }
.label2             { background: #cfcfcf; color: #000; }
.label3             { background: #f00; color: #fff; }










/* ------------------------------------------------------------
A-5. 罫線、装飾、その他
------------------------------------------------------------ */


/* .border */
.border             { padding: 10px; border: 1px solid #ccc; }
.border.dot         { border-style: dotted; }


/* ul */
ul.nostyle          { list-style: none; }


/* フェード効果 */
@-webkit-keyframes fadeIn { 0% { opacity: 0; display: block; } 100% {opacity: 1; }}


/* .colorbox.videos */
a.backtoindex       { display: none; line-height: 30px; padding: 0 10px; }
















/* ------------------------------------------------------------
B-1. 全体レイアウト
------------------------------------------------------------ */

html                { background: #000; }
body                { background: #fff; }

#main               { min-width: 970px; background: #fff; }
#main   .inner      { position: relative; width: 970px; margin: 0 auto; }
#main   .inner      { padding-bottom: 15px; }

.isApp #header-global,
.isApp #footer     { display: none !important; }
.isApp .hidden-app { display: none !important; }








/* ------------------------------------------------------------
B-2. グローバルヘッダ
------------------------------------------------------------ */
@-ms-viewport {
  width: device-width;
}












/* ------------------------------------------------------------
B-3. グローバルフッタ
------------------------------------------------------------ */






















/* ------------------------------------------------------------
M-1. デバイス別
------------------------------------------------------------ */


/* 排他処理 */
.pconly                       { display: inline-block; }
html.touch .pconly            { display: none; }

.touchonly,
.mobileonly,
.tabletonly                   { display: none; }
html.touch .touchonly,
html.mobile .mobileonly,
html.tablet .tabletonly       { display: inline-block; }










/* ------------------------------------------------------------
M-2. デバイス別：Touch
------------------------------------------------------------ */


@media screen and (orientation:portrait) {

  /* 共用 */
  html.touch img                { width: auto \9; max-width: 100%; height: auto; -ms-interpolation-mode: bicubic; }



  /* 全体レイアウト */
  html.touch #header,
  html.touch #footer,
  html.touch #main              { min-width: 720px; }
  html.touch #header .inner,
  html.touch #footer .inner,
  html.touch #main   .inner     { width: auto; max-width: 1280px; }
  html.touch #header .inner     { padding: 0 10px 0 0; }
  html.touch #footer .inner     { padding: 0 10px; }
  html.touch #main   .inner     { padding: 0 20px 20px; }



  /* グローバルヘッダ：ブランドヘッダ */
  html.touch .brandheader .logo-corp { right: 15px; }



  /* グローバルヘッダ：メインナビ */
  html.touch .main-nav          { padding-right: 170px; }
  html.touch .main-nav li:first-child { background: none; }
  html.touch .main-nav li span  { margin: auto; }
  html.touch .searchbox         { width: 170px; padding-right: 0; }
  html.touch .searchbox .icon   { right: 9px; }

}





/* グローバルフッタ：ディレクトリナビ */
html.touch .directory-nav     { width: 100%; margin: 0 0 20px 0; }
html.touch .directory-nav a   { padding: 12px 0 12px 5px; color: #666; }
html.touch .directory-nav dl  { float: none; width: auto; margin: 0 20px 0 0; border: none; }
html.touch .directory-nav dt  { margin: 0; border-top: 1px solid #ccc; font-size: 14px; font-weight: normal; }
html.touch .directory-nav dl:nth-child(1) dt { border-top: none; }
html.touch .directory-nav dd  { display: none; margin-left: 18px; padding-left: 5px; border-top: 1px dotted #ccc; background: #f9f9f9; font-size: 13px; }
html.touch .directory-nav dd.haschild ul       { position: relative; width: auto; margin: 0 1px 0 20px; padding: 0; border: none; background: #fff; }
html.touch .directory-nav dd.haschild:hover ul { display: none; -webkit-animation-name: none; }
html.touch .directory-nav dd.haschild li       { float: none; width: auto; margin: 0; border-top: 1px dotted #ccc; }
html.touch .directory-nav dd.haschild li a     { padding-left: 10px; }
html.touch .directory-nav dd.haschild:hover a  { background: inherit; color: #666; }

html.touch .directory-nav .arrow               { display: inline-block; }
html.touch .directory-nav .active .arrow       { background-position-x: -25px; }



/* グローバルフッタ：ネットワークナビ */
html.touch .network-nav dl         { width: 200px; padding-left: 14px; border-left: none; }
html.touch .customDropDownControl  { margin-top: 1px; }





/* Android 4 half-width blank issue */
/* Chrome x orientation:portrait : font-size issue */
html.touch p,
html.touch h1,
html.touch h2,
html.touch h3,
html.touch h4,
html.touch h5,
html.touch ul,
html.touch li,
html.touch dt,
html.touch dd,
html.touch table,
html.touch th,
html.touch td,
html.touch #footer a,
html.touch .small { background: url(../img/dummy.png); }







































/* ------------------------------------------------------------
X-1. JSライブラリ関連
------------------------------------------------------------ */

/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:hidden;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box;}
/*
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#111;}
#colorbox{}
#cboxContent{margin-top:32px; overflow:visible;}
.cboxIframe{background:#111;}
#cboxError{padding:50px; border:1px solid #ccc;}

#cboxLoadedContent {background: #fff; padding: 10px 10px 50px; *padding-bottom: 65px; }
#cboxLoadingGraphic{background:url(../img/colorbox/loading.gif) no-repeat center center;}
#cboxLoadingOverlay{background:#000;}

#cboxTitle{position:absolute; min-height: 30px; *min-height: 45px; bottom:5px; left:10px; color:#000;}

#cboxClose {text-indent:-9999px;width:20px; height:20px; position:absolute; top:-20px; background:url(../img/colorbox/controls.png) no-repeat 0 0;}
#cboxCurrent{position:absolute; bottom:15px; left:10px; }
#cboxSlideshow, #cboxPrevious, #cboxNext {position:absolute; bottom:15px; }
#cboxPrevious{left:65px;}
#cboxNext{left:110px;}
#cboxPrevious:hover,
#cboxNext:hover {color:#999;}
#cboxClose{background-position:-50px 0px; right:0;}
#cboxClose:hover{background-position:-50px -25px;}
.cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;}
.cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;}
.cboxSlideshow_on #cboxSlideshow:hover{background-position:-100px -25px;}
.cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;}
.cboxSlideshow_off #cboxSlideshow:hover{background-position:-75px -25px;}


