@charset "utf-8";

/* base */
/** font **/
/*** Roboto ***/
@font-face {
font-family:'Roboto';
src:local('Roboto Regular'), local('Roboto-Regular'), url(http://themes.googleusercontent.com/static/fonts/roboto/v10/2UX7WLTfW3W8TclTUvlFyQ.woff) format('woff');
font-weight:400;
font-style:normal;
}
/*** goma ***/
@font-face {
font-family:'goma';
src:url('/common/font/goma/goma.eot?v=1.0');
src:url('/common/font/goma/goma.eot?#iefix&v=1.0') format('embedded-opentype'), url('/common/font/goma/goma.woff?v=1.0') format('woff'), url('/common/font/goma/goma.ttf?v=1.0') format('truetype'), url('/common/font/goma/goma.svg?v=1.0#gomaregular') format('svg');
font-weight:normal;
font-style:normal;
}
/*** BLOKKRegular ***/
@font-face {
font-family: 'BLOKKRegular';
src: url('/common/font/blokkregular/BLOKKRegular.eot');
src: url('/common/font/blokkregular/BLOKKRegular.eot?#iefix') format('/common/font/blokkregular/embedded-opentype'),url('/common/font/blokkregular/BLOKKRegular.woff') format('woff'),url('/common/font/blokkregular/BLOKKRegular.svg#BLOKKRegular') format('svg');
font-weight: normal;
font-style: normal;
}

/** html **/
html{
font-family:'Roboto', Helvetica, 'ヒラギノ角ゴ ProN W3', 'ヒラギノ角ゴPro W3', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic ProN', 'モリサワ 新ゴ R', 'Droid Sans', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', Arial, Helvetica, sans-serif;
overflow-y:scroll;
-ms-text-size-adjust:100%;
-webkit-text-size-adjust:100%;
}
body{
margin:0;
color:#5a5a5a;
background:#f2f2f2;
font-size:87.5%;
line-height:1.3;
}
/** links **/
/*** a ***/
a{
word-break:break-all;
text-decoration:none;
background:transparent;
word-wrap:break-word;
}
a:focus{
outline:thin dotted;
}
a:link,
a:visited{
color:#3390ff;
}
a:hover,
a:active{
color:#5abdff;
outline:0;
}
/** embedded content **/
img{
border:0;
vertical-align:bottom;
}
pre{
border-left:3px solid #6ce26c !important;
padding:10px 15px;
}
pre.xhtml{
border-left:3px solid #0072ff !important;
}
pre.css{
border-left:3px solid #ef857d !important;
}
pre.js{
border-left:3px solid #f6ac19 !important;
}
/** list **/
/*** ul ***/
ul{
list-style:none;
padding:0;
}
ul li{
line-height:1.5;
}
ul li ul{
margin:0 0 0 15px;
}
ul.normal{
list-style-type:disc;
padding-left:1.5em;
}
/*** ol ***/
ol{
list-style:none;
}
ol.normal{
list-style-type:decimal
}
ol.uprAlpha{
list-style-type:upper-alpha
}
ol.lowAlpha{
list-style-type:lower-alpha
}
ol.uprRoman{
list-style-type:upper-roman
}
ol.lowRoman{
list-style-type:lower-roman
}
/*** dl ***/
dl{
margin:0;
}
dt{
}
dd{
margin:0;
}
dl.number{
margin:0;
}
dl.number dt{
margin:0 0 10px;
font-size:100%;
background:#fff;
border-left:8px solid #00b9ef;
border-bottom:1px solid #00b9ef;
}
dl.number dd{
margin:0;
}

/* table */
table{
border-collapse:collapse;
border-spacing:0;
margin:0 0 30px;
padding:0;
}
caption, th{
text-align:left;
}

/* typography */
/** heading **/
h1{
font-size:250%;
margin:14px 0;
}
h2{
font-size:171.42%;
margin:14px 0;
}
h3{
font-size:128.57%;
margin:14px 0;
}
h4,
h5,
h6{
font-size:128.57%;
margin:14px 0;
}
.demo{
font-family: 'BLOKKRegular';
word-break:break-all;
text-decoration:none;
background:transparent;
word-wrap:break-word;
}
.htmlHead,
.cssHead,
.jsHead,
.configHead,
.infoHead{
padding:0.3em 0.7em;
color:#fff;
border-radius:5px;
}
.htmlHead{
background:#0072ff;
}
.cssHead{
background:#ef857d;
}
.jsHead{
background:#f6ac19;
}
.configHead{
background:#5EB95E;
}
.infoHead{
background:#b5b5b5;
}
pre{
-moz-tab-size:4;
tab-size:2;
}
/* noscript */
.noscript{
background:#ff4646;
color:#fff;
overflow:hidden;
}
.noscript .noscriptIn{
width:1000px;
margin:0 auto;
text-align:center;
font-size:128.57%;
font-weight:bold;
}

/* header */
#header{
background:#fff;
box-shadow:0 2px 3px -2px rgba(50, 50, 50, 0.5);
}
.headerIn{
width:1000px;
margin:0 auto 1em;
background:#fff;
overflow:hidden;
}
#header .inner{
padding:10px 15px;
}
#header p{
margin:0;
}

/* footer */
.footer{
background:#fff;
}
.footerIn{
width:1000px;
margin:0 auto;
overflow:hidden;
}
.footer .footerLinks{
padding:10px 15px;
}
.footer .footerLinks ul{
clear:both;
overflow:hidden;
margin:0;
}
.footer .footerLinks ul li{
float:left;
margin-right:1em;
}
.copyright{
text-align:center;
width:1000px;
margin:0 auto;
}
/* pageTop */
.pageTop{
position:fixed;
right:40px;
bottom:40px;
display:inline;
margin:0;
}
.pageTop li{
float:left;
margin-right:10px;
font-size:571.42%;
line-height:1;
}
.pageTop li:last-child{
margin-right:0;
}
.pageTop li a{
color:#333;
opacity:.5;
}
.pageTop a{
display:block;
font-family:'goma';
}
.pageTop a:hover{
opacity:1;
}
/* contentWrap */
.contentWrap{
display:block;
width:1000px;
margin:0 auto 30px;
}
.contentWrap:after{
content:".";
display:block;
height:0;
font-size:0;
clear:both;
visibility:hidden;
}
.contentWrap .mainContent{
width:670px;
float:left;
margin-bottom:0;
}
.contentWrap .sideContent{
float:right;
width:320px;
}
.contentWrap .sideContent .section:last-child{
margin-bottom:3px;
}
.contentWrap .sideContent .inner{
padding:0 10px;
}
.contentWrap.otherSide .mainContent{
float:right;
}
.contentWrap.otherSide .sideContent{
float:left;
}
/* mainContent */
.mainContent{
width:1000px;
margin:0 auto 30px;
}
.section{
clear:both;
overflow:hidden;
margin-bottom:30px;
background:#fff;
border-radius:3px;
box-shadow:0 2px 3px -2px rgba(50, 50, 50, 0.5);
}
.section .inner{
padding:0 15px;
margin-bottom:30px;
}
.section .inner:first-child:last-child{
margin-bottom:0;
}

/* common */
/** link **/
.anchorLink a,
.pageTop,
.icon,
a:before,
a:after{
font-family:'goma';
}
.blank:after,
a[href^="//"]:after,
a[href^="http"]:after{
content:"\f08e";
padding-left:0.3em;
}
.syntaxhighlighter a:after{
content:"";
padding:0;
}
.icon{
margin:0 0.2em;
}
/*** anchorLink ***/
.anchorLink{
}
.anchorLink a{
display:none;
vertical-align:middle;
}
.anchorLink a:before,
.anchorLink a:after{
content:""!important;
}
.anchorLink:hover a{
display:inline-block;
margin-left:0.2em;
font-size:76.92%;
}
/*** pageTop ***/
.pageTop{
cursor:pointer;
}
/*** seeAll ***/
.seeAll{
text-align:right;
margin-top:0;
}
/*** txtLink ***/
.txtLink a{
display:inline-block;
padding-left:0.3em;
}
.txtLink a:before{
content:"\f0da";
padding-right:0.3em;
}
.txtLink a[href^="#"]:before{
content:"\f0d7";
}
/*** btnLink ***/
.btnLinkWrap{
text-align:center;
}
.btnLinkWrap .btnLink{
display:inline-block;
margin-top:0;
}
.btnLink{
clear:both;
overflow:hidden;
}
.btnLink li{
float:left;
}
.btnLink a{
display:inline-block;
margin:0 1em 0.8em 0;
padding:0.5em 0.8em;
color:#fff;
background:#a8a8a8;
box-shadow:0 3px #595959;
border-radius:5px;
}
.col2.btnLink a,
.col3.btnLink a,
.col4.btnLink a{
margin-right:0;
}
.btnLink li:last-child a{
margin-right:0;
}
.btnLink a:hover{
background:#bababa;
}
/**** bgPurple ****/
.btnLink a.bgPurple{
background:#485bbd;
box-shadow:0 3px #2c40a2;
}
.btnLink a.bgPurple:hover{
background:#6678d1;
}
/**** bgRed ****/
.btnLink a.bgRed{
background:#e30a0a;
box-shadow:0 3px #b70101;
}
.btnLink a.bgRed:hover{
background:#ed2b2b;
}
/**** bgGreen ****/
.btnLink a.bgGreen{
background:#0fcf7b;
box-shadow:0 3px #01a960;
}
.btnLink a.bgGreen:hover{
background:#29e895;
}
/**** sky ****/
.btnLink a.sky{
background:#4ba5d0;
box-shadow:0 3px #2180ae;
}
.btnLink a.sky:hover{
background:#69bee7;
}
/**** bgYellow ****/
.btnLink a.bgYellow{
background:#ffd200;
box-shadow:0 3px #e8bf00;
}
.btnLink a.bgYellow:hover{
background:#ffdf48;
}

/** font/text **/
/*** textl-align ***/
.txtAL{
text-align:left!important;
}
.txtAC{
text-align:center!important;
}
.txtAR{
text-align:right!important;
}
/*** font-size ***/
.fontL{font-size:142.85%;}
.fontLL{font-size:157.14%;}
.fontXL{font-size:200%;}
/** paging **/
.paging{
width:100%;
text-align:center;
}
.paging ul{
clear:both;
overflow:hidden;
display:inline-block;
margin:0 auto 30px;
padding:0;
}
.paging ul li{
float:left;
margin-right:5px;
font-weight:bold;
text-align:center;
background:#ffffff;
}
.paging ul li:last-child{
margin-right:0;
}
.paging ul li a,
.paging ul li span{
display:block;
padding:10px;
}
.paging ul li.prev a,
.paging ul li.next a,
.paging ul li.prev span,
.paging ul li.next span{
font-weight:normal;
}
.paging ul li.prev span:before,
.paging ul li.next span:after{
font-family:'goma';
}
.paging ul li.prev a:before,
.paging ul li.prev span:before{
margin-right:0.3em;
content:"\f060";
}
.paging ul li.next a:after,
.paging ul li.next span:after{
margin-left:0.3em;
content:"\f061";
}
.paging ul li.on{
padding:10px;
color:#fff;
background:#26b7bc;
}

/** col **/
.col{
display:block;
}
.col:after{
content:".";
display:block;
height:0;
font-size:0;
clear:both;
visibility:hidden;
}
.colIn{
float:left;
}
.heiFixed .colIn{
position:relative;
}
.colIn img{
max-width:100%;
height:auto;
}
.heiFixed .colIn .sectionBtm{
position:absolute;
left:0;
bottom:1.3em;
width:100%;
text-align:center;
}
.heiFixed .colIn .sectionBtm .sectionBtmIn{
padding:0 15px;
}
.heiFixed .colIn .sectionBtm .sectionBtmIn .btnLink{
display:inline-block;
margin:0;
}
.heiFixed .colIn .sectionBtm .sectionBtmIn p{
margin-top:0;
text-align:left;
}
/*** col2 ***/
.col2 .colIn{
width:49%;
margin-right:2%;
}
.col2 .colIn:nth-child(2n){
margin-right:0;
}
.col2 .colIn .section{
margin-bottom:20px;
}
.col2 .colIn .inner{
padding:0 15px;
}
/*** col3 ***/
.col3 .colIn{
width:32%;
margin-right:2%;
}
.col3 .colIn:nth-child(3n){
margin-right:0;
}
.col3 .colIn .section{
margin-bottom:20px;
}
.col3 .colIn .inner{
padding:0 15px;
}
/*** col4 ***/
.col4 .colIn{
width:24.25%;
margin-right:1%;
}
.col4 .colIn:nth-child(4n){
margin-right:0;
}
.col4 .colIn .section{
margin-bottom:20px;
}
.col4 .colIn .inner{
padding:0 15px;
}

/** withImg **/
.withImg{
overflow:hidden;
width:100%;
position:relative;
}
.withImg .imgL{
float:left;
margin:0 15px 0 0;
display:inline;
}
.withImg .imgR{
float:right;
margin:0 0 0 15px;
display:inline;
}

/** withImgCol **/
.withImgCol{
overflow:hidden;
width:100%;
position:relative;
}
.withImgCol .imgL{
float:left;
margin:0 15px 0 0;
display:inline;
}
.withImgCol .imgR{
float:right;
margin:0 0 0 15px;
display:inline;
}
.withImgCol .txtR,
.withImgCol .txtL{
overflow:hidden;
}

/** table style **/
table.type1 caption{
font-weight:bold;
padding-bottom:10px;
}
table.type1{
width:100%;
border-bottom:1px solid #dcdde0;
border-right:1px solid #dcdde0;
line-height:1.7;
background:#fff;
}
table.type1 th{
padding:15px;
border-left:1px solid #dcdde0;
border-top:1px solid #dcdde0;
font-weight:bold;
vertical-align:top;
background:#eee;
}
table.type1 td{
padding:15px;
border-left:1px solid #dcdde0;
border-top:1px solid #dcdde0;
vertical-align:top;
}
/*** table width ***/
table.wid10{width:10%;}
table.wid15{width:15%;}
table.wid20{width:20%;}
table.wid25{width:25%;}
table.wid30{width:30%;}
table.wid35{width:35%;}
table.wid40{width:40%;}
table.wid45{width:45%;}
table.wid50{width:50%;}
table.wid55{width:55%;}
table.wid60{width:60%;}
table.wid65{width:65%;}
table.wid70{width:70%;}
table.wid75{width:75%;}
table.wid80{width:80%;}
table.wid85{width:85%;}
table.wid90{width:90%;}
table.wid95{width:95%;}
table.wid98{width:98%;}
/*** cell width ***/
.wid5{width:4.9%;}
.wid10{width:9.9%;}
.wid15{width:14.9%;}
.wid20{width:19.9%;}
.wid25{width:24.9%;}
.wid30{width:29.9%;}
.wid35{width:34.9%;}
.wid40{width:39.9%;}
.wid45{width:44.9%;}
.wid50{width:49.9%;}
.wid55{width:54.9%;}
.wid60{width:59.9%;}
.wid65{width:64.9%;}
.wid70{width:69.9%;}
.wid75{width:74.9%;}
.wid80{width:79.9%;}
.wid85{width:84.9%;}
.wid90{width:89.9%;}
.wid95{width:95.9%;}
.wid98{width:98.9%;}
.wid100{width:100%;}

/** margin **/
.mb0{margin-bottom:0!important;}
.mb1em{margin-bottom:1em!important;}
