/** **********************************
    
SETTINGS

濃い青　　　　　　：#0052a5
水色　　　　　　　：#00a0e8
青っぽいグレー　　：#e4eaf2
青っぽいグレー2　 ：#f0f4f7

********************************** **/
			  

*{
	background-repeat:no-repeat;
	line-height:140%;
	margin:0;
	padding:0;
	outline: none
}

*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
 
a {text-decoration:none; overflow:hidden; color:#333}


img {border: none; line-height:0; vertical-align:bottom;max-width: 100%;-webkit-backface-visibility: hidden}
img[data-echo]{ 
	min-width:50px; 
	min-height:50px; 
	background-image:url(../images/common/loader-white.gif); 
	background-position:center center;
	border:solid 1px #ddd;
	border-radius:5px
}
img[data-echo].loaded{background-image:none}


.clear{clear:both; height:0; line-height:0; font-size:0}

.space10 {height: 10px}
.space20 {height: 20px}
.space30 {height: 30px}
.space40 {height: 40px}
.space100 {height: 100px}

.mt5{margin-top:5px}
.mt10{margin-top:10px}
.mt20{margin-top:20px}
.mt30{margin-top:30px}
.mt40{margin-top:40px}
.mt50{margin-top:50px}

.mb5{margin-bottom:5px}
.mb10{margin-bottom:10px}
.mb20{margin-bottom:20px}
.mb30{margin-bottom:30px}
.mb40{margin-bottom:40px}
.mb50{margin-bottom:50px}

.ml5{margin-left:5px}
.ml10{margin-left:10px}
.ml20{margin-left:20px}
.ml30{margin-left:30px}
.ml40{margin-left:40px}
.ml50{margin-left:50px}

.mr5{margin-right:5px}
.mr10{margin-right:10px}
.mr20{margin-right:20px}
.mr30{margin-right:30px}
.mr40{margin-right:40px}
.mr50{margin-right:50px}

.font0{font-size:0}
.font10{font-size:10px}
.font12{font-size:12px}
.font14{font-size:14px}
.bold{font-weight:bold}
.txt-left{text-align:left}
.txt-center{text-align:center}
.txt-right{text-align:right}
.red{color:#C00}

li{list-style: none}

.alpha{
	-webkit-transition: all 0.4s ease-out;
	-moz-transition: all 0.4s ease-out;
	-o-transition: all 0.4s ease-out;
	-ms-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
}

.alpha:hover{
	filter: alpha(opacity=70);
	-moz-opacity:0.75;
	opacity:0.75;
}

.wrap-alpha a{
	-webkit-transition: all 0.4s ease-out;
	-moz-transition: all 0.4s ease-out;
	-o-transition: all 0.4s ease-out;
	-ms-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
}
.wrap-alpha a:hover{
	filter: alpha(opacity=70);
	-moz-opacity:0.75;
	opacity:0.75;
}

.transition-01{ 
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
.transition-02{ 
	-webkit-transition: all 0.4s ease-out;
	-moz-transition: all 0.4s ease-out;
	-o-transition: all 0.4s ease-out;
	-ms-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
}
.transition-03{ 
	-webkit-transition: all 0.6s ease-out;
	-moz-transition: all 0.6s ease-out;
	-o-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}


.bd-01{background: linear-gradient(transparent 60%, rgba(252,238,33,.6) 0%); font-weight: bold}
.bd-02{background: linear-gradient(transparent 60%, rgba(228,0,3,.4) 0%); font-weight: bold}
.bd-03{background: linear-gradient(transparent 60%, rgba(0,65,219,0.50)  0%); font-weight: bold}

.cursor{cursor:pointer; cursor:hand}

th,td{text-align:left}

input[type="text"]:focus {outline: 0;}
button:focus {outline: 0;-webkit-appearance: none;border-radius: 0;}

#page-top {width: 60px; height: 60px; position: fixed; right:20px; bottom:20px;display: none}


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

#page-top {width: 40px; height: 40px;right:10px; bottom:10px}

}



.clearfix:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
}
.clearfix { display: inline-table}
.clearfix{zoom:1}/** for IE7 **/

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

.link a{color:#0052a5}
.link a:hover{color:#ffb700}

#window-size{position: fixed; bottom:10px; left: 10px; width: 200px; background-color: #fff; font-size: 16px; font-weight: bold; z-index: 9999; text-align: center;padding: 10px; display: none}

#ie-notice{background-color: #fff; padding: 10px; text-align: center; font-size: 16px; font-weight: bold; color:red}

hr{margin: 30px 0; border:none; height: 1px; background-color: #333}

/** ***********************************************

COMMON

*********************************************** **/



.cols-2{font-size:0;}
.cols-2 .col{font-size:14px; display: inline-block; vertical-align: top; width :50%}

.cols-3{font-size:0;}
.cols-3 .col{font-size:14px; display: inline-block; vertical-align: top; width :33.33333%}

.cols-4{font-size:0;}
.cols-4 .col{font-size:14px; display: inline-block; vertical-align: top; width :25%}


.tr{display:table;table-layout: fixed;border-collapse: collapse;width: 100%}
.td{display: table-cell; vertical-align:top;word-wrap: break-word;overflow: hidden; word-break: break-all;}
.th{display: table-cell; vertical-align:top;word-wrap: break-word;overflow: hidden; word-break: break-all;font-weight:bold}

.reset{ font-size:0; letter-spacing:.5}
.reset li{font-size:14px; letter-spacing:normal}

.full{width:100%; height:auto}

.hr-list{letter-spacing: -0.5em}
.hr-list li{display:inline-block; vertical-align:top;letter-spacing: normal}

.table-style-01{width:100%}
.table-style-01 table{width:100%;border-collapse:separate;border-spacing:1px;}
.table-style-01 th{padding:10px; text-align:right;}
.table-style-01 td{padding:10px;}


.table-style-02{width:100%;background-color:#ccc}
.table-style-02 table{width:100%;border-collapse:separate;border-spacing:1px;}
.table-style-02 th{text-align:right; padding:8px 10px; vertical-align:top; white-space:nowrap;background:#eee}
.table-style-02 td{ padding:8px 10px; background-color:#fff}

.bt-blue a{color:#fff; display:block; padding:15px 10px; text-align:center; background-color:#269FE0;-webkit-border-radius: 5px;-moz-border-radius:5px;border-radius:5px; border-bottom:solid 3px #069}
.bt-blue a:hover{background-color:#CCC;border-bottom:none; margin-top:11px!important}

.bt-blue-02 a{color:#fff; display:block; padding:10px 10px; text-align:center; background-color:#269FE0;-webkit-border-radius: 4px;-moz-border-radius:4px;border-radius:4px}
.bt-blue-02 a:hover{background-color:#CCC}

.bt-orange a{color:#fff; display:block; padding:15px 10px; text-align:center; background:#F90;-webkit-border-radius: 5px;-moz-border-radius:5px;border-radius:5px; border:solid 1px #fff;
	background: -moz-linear-gradient(top ,#F90, #F60);
    background: -webkit-gradient(linear, left top, left bottom, from(#F90), to(#F60));
    background: linear-gradient(to bottom, #F90, #F60);
}
.bt-orange a:hover{background:#F60}


body{
	-webkit-text-size-adjust: 100%;
	word-break: break-all;
	font-family:   "メイリオ", Meiryo, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;
	font-size: 100%;
	
}
.mincho{font-family: "游明朝体", "Yu Mincho", YuMincho, 'Hiragino Mincho ProN', "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;}

.inner{width:100%; max-width: 1142px; margin:0 auto; position:relative; padding: 0 10px}
#main .inner{max-width: 1400px}



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

.inner{padding: 0}

}


/**  Slick Base  fadeする場合はslick.cssの読み込みが必要**/

.slick{overflow: hidden; width: 100%; position: relative;-webkit-backface-visibility: hidden}
.slick li.slick-slide{display: inline-block; vertical-align: middle;overflow: hidden}
.slick li.slick-slide img{width: 100%; height: auto}
.slick-arrow{position: absolute; top:50%; font-size: 50px; margin-top: -50px; z-index: 2}
.slick-prev{left:10px}
.slick-next{right:10px}

.slick-dots{text-align: center; position: absolute; bottom:0px; left: 0 ;width: 100%}
.slick-dots li{display: inline-block; width: 10px; height: 10px; margin: 0 5px; background-color: #ddd; border-radius: 100%; text-indent: -9999px; cursor: pointer}
.slick-dots li.slick-active{background-color:#0071bc}


/** ***********************************************

HEADER

*********************************************** **/
#header{padding: 5px 0 0}
#header .left{max-width: 220px;float:left}
#header .right{max-width: 350px;float:right;padding-top: 5px}
#header .right input.txt-m{height: 30px; background-color: #eee; border:solid 1px #ddd; border-radius: 3px; padding: 15px 8px; font-size: 12px;width: 250px;margin-right: 5px}
#header .right .bt-submit{background-color: #999; color:#fff; padding: 8px 10px; border:none; border-radius: 3px;cursor:pointer}


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

#header .left{max-width: 220px;float:none}
#header .right{max-width: 100%;float:none;padding-top: 5px}
#header .right input.txt-m{width: 85%}

}


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

#header .right input.txt-m{width: 80%}

}

/** ***********************************************

GLOBAL MENU

*********************************************** **/
#g-navi{border-top:solid 1px #ddd;border-bottom:solid 1px #ddd; display: block}
#g-navi ul{display: table; width: 100%;border-right:solid 1px #ddd}
#g-navi li{display: table-cell;position: relative}
#g-navi li a{display: block; font-size: 14px; background-color: #fff;padding: 20px;border-left:solid 1px #ddd; text-align: center;position: relative}
#g-navi li a:hover{background-color: #eee}
#g-navi li a i{position: absolute; top:16px; right:10px; font-size: 16px; color:#999}


#g-navi .sub-menu{display: none;position: absolute;top:59px; left: 0;border-top:solid 1px #ddd;border-bottom:solid 1px #ddd;width: 200px;z-index: 10}
#g-navi .sub-menu li{display: block}

@media screen and (min-width: 800px) {
#g-navi .has-sub:hover .sub-menu{display: block}
}


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

#g-navi li a{font-size: 12px}

}


#bt-nav {display: none}

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

#g-navi{display: none; border:none;margin-top: 10px}
#g-navi li{display: block}
#g-navi li a{border-bottom: solid 1px #ddd; font-size: 14px; padding: 10px}
#g-navi .sub-menu{display: none;position: inherit;top:0px; left: 0;border-top:none;border-bottom:none;width: 100%;z-index: 10}
#g-navi li:first-child a{border-top:solid 1px #ddd}
#g-navi .sub-menu li{display: block}
#g-navi .sub-menu li a{background-color: #ddd}






#bt-nav {display: block; position: absolute; top:0px; right:0px;background-color:#eee;padding: 12px; }
#bt-nav .item-01{border-top:solid 3px #777;width:30px; display:block}
#bt-nav .item-02{border-top:solid 3px #777;width:30px; display:block; margin-top:6px}
#bt-nav .item-03{border-top:solid 3px #777;width:30px; display:block; margin-top:6px}

#bt-nav.on .item-01{
	-webkit-transform: rotate(-36deg);
	transform: rotate(-36deg);
	transform-origin:right;
}
#bt-nav.on .item-02{width:0}
#bt-nav.on .item-03{width:30px;
	-webkit-transform: rotate(36deg);
	transform: rotate(36deg);
	transform-origin:right;
}

}


/** ***********************************************

TOP MAIN

*********************************************** **/


#top-main{padding: 10px 0 0;}
#top-main img{width: 100%; height: auto}


#contents{margin-top: 20px}
#contents .left-contents{background-color: #eee;min-height: 500px; display: inline-block; vertical-align: top;width: 74%; font-size: 14px;border-right:solid 1px #ddd; padding: 10px}
#contents .right-contents{background-color: #fff;min-height: 500px;display: inline-block; vertical-align: top;width: 26%; font-size: 14px; padding-left: 30px;overflow-x: hidden;overflow-y:hidden}


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

#contents .left-contents{display: block; width:100%; font-size: 14px;border-right:none}
#contents .right-contents{display: block; width: 100%;padding-left: 0px}

}

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

#contents .right-contents{padding: 0 10px}

}

#contents .wrap-cat{background-color: rgba(80,187,199,1.00); border:solid 2px #000}
#contents .wrap-cat .col{padding: 10px}
#contents .wrap-cat a{display: block}
#contents .wrap-cat .wrap-img{margin-bottom: 10px}
#contents .wrap-cat .cat-title{background-color:rgba(36,74,115,1.00);color:#fff; font-size: 16px; padding: 20px 10px; text-align: center;letter-spacing: 1px;margin-bottom: 10px; box-shadow: 0px 0px 6px #333}
#contents .wrap-cat .desc{font-size: 16px;letter-spacing: 1px}

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

#contents .wrap-cat .col{width:33.333333333%}
#contents .wrap-cat .desc{font-size: 14px}

}

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

#contents .wrap-cat .col{width:100%; display: block}

}



.title-style-01{font-size: 24px; font-weight: bold; margin-bottom: 20px;letter-spacing: 1px}

#contents .wrap-list .item{border-bottom:solid 1px #ddd; padding-bottom: 14px; margin-bottom: 15px}
#contents .wrap-list .col-1{width: 25%}
#contents .wrap-list .col-2{width: 75%; padding-left: 30px}
#contents .wrap-list .wrap-img img{width: 100%; height: auto}
#contents .wrap-list .col-2 h3.title{margin-bottom: 10px}
#contents .wrap-list .category{margin-bottom: 10px}
#contents .wrap-list .category a{text-decoration: underline}
#contents .wrap-list .date{margin-bottom: 10px; font-size: 12px; color:#999}

.wrap-list .noimage{display: block; width: 100%; height: 160px; background-color: #fff; text-align: center;padding-top:70px; font-size: 16px;color:#666}
.wrap-list .noimage::after{content:"No Image"; font-style: normal;}


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

.wrap-list .col-1{width: 25%}
.wrap-list .col-2{width: 75%; padding-left: 30px}

}



.pager{text-align: center; padding: 30px 0}
.pager span,
.pager a{display: inline-block; padding: 10px 15px;border:solid 1px rgba(232,152,21,1.00); color:rgba(232,152,21,1.00); border-radius: 3px; vertical-align: top;margin-right: 5px}
.pager .current,
.pager a:hover{background-color: rgba(232,152,21,1.00);color:#fff}

#pager{text-align: center;padding: 30px 0}


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

.pager{text-align: left}
.pager span,
.pager a{margin-bottom: 10px}

}



.bt-tw{display: inline-block; vertical-align: top}
.fb-like{display: inline-block; vertical-align: top}
.hatena{display: inline-block; vertical-align: top}



.tag-cloud li{display: inline-block; vertical-align: top; margin-right: 5px; margin-bottom: 10px; }
.tag-cloud li a{display: block;background-color: #fff; border:solid 1px #ddd; padding: 8px; font-size: 12px;color:#888}
.tag-cloud li i{margin-right: 3px}



#contents .right-contents .item{padding-bottom: 20px}
#contents .right-contents .item .archive li{color:#999;margin-bottom: 5px}
#contents .right-contents .item .archive li a{color:#999; font-size: 14px}

#contents .right-contents .bns a{border:solid 3px #000;display: block; margin-bottom: 10px}
#contents .right-contents .bns p{margin-bottom: 1em; font-size: 12px}

.wrap-kt{background-color: #333;text-align: center;padding: 20px}
.wrap-kt a{color:#fff; font-size: 14px}
#copyright{display: block; background-color: rgba(7,26,33,1.00); color:#fff; font-size: 10px; letter-spacing: 2px; text-align: center;padding: 20px}


.single-contents{padding: 30px; max-width: 1060px;margin: 0 auto}
.cat-list li{padding: 10px;position: relative; border-bottom: none!important}
.cat-list li .wrap-item{box-shadow: 1px 0px 5px #ddd;padding: 10px}
.cat-list li .wrap-img{margin-bottom: 10px}
.cat-list li .title{margin-bottom: 5px}


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

.single-contents{padding: 10px}
.cat-list li.col{width: 100%}

}

#bnavi{background-color:rgba(232,152,21,1.00); color:#fff}
#bnavi .inner{max-width: 1100px;padding: 15px 0px;}
#bnavi li{display: inline-block; vertical-align: middle; font-size: 14px}
#bnavi li::after{content:" / "}
#bnavi li a{color:#fff}
#bnavi li a:hover{text-decoration: underline;color:#eee}


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

#bnavi{display: none}
#bnavi .inner{padding: 15px 10px;margin-top: 20px}
#bnavi li{font-size: 12px}

}


#single .entry-title{font-size: 30px; letter-spacing: 2px; margin-bottom: 5px;border-bottom:solid 1px #ddd; padding-bottom: 10px}
#single .article-meta-info{margin-bottom: 30px}
#single .article-meta-info span{font-size: 12px}
#single .article-meta-info .fa{margin-right: 5px}
#single .article-meta-info a{color:#999}
#single .article-meta-info .article-tags{display: block}
#single .article-meta-info .article-tags a{margin-right: 5px;color:#999}
#single .component{font-size: 18px; letter-spacing: 1px;margin-bottom: 30px; max-width: 900px; margin: 0 auto 30px}
#single .component p{line-height: 180%}
#single .component img{margin: 10px auto; max-height: 700px}

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

#single .entry-title{font-size: 20px}
#single .component {font-size: 14px!important}
#single .component p{font-size: 14px!important}
#single .component span{font-size: 14px!important}

}


#single .wrap-author{max-width: 900px; margin: 0 auto;margin-bottom: 30px;border:solid 1px #ddd; padding: 20px}
#single .wrap-author .col-1{width: 20%}
#single .wrap-author .col-2{width: 80%; padding-left: 20px}
#single .wrap-author .col-2 p.name{font-size: 18px; margin-bottom: 10px;  font-weight: bold}
#single .wrap-author .col-2 p.desc{line-height: 160%}

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

#single .wrap-author .col-1{width: 100%;display: block;padding-bottom: 30px}
#single .wrap-author .col-2{width: 100%; padding-left: 0px;display: block}
#single .wrap-author .col-2 p.name{font-size: 14px}
#single .wrap-author .col-2 p.desc{font-size: 12px}

}

#single .wrap-pd{max-width: 900px; margin: 0 auto;margin-bottom: 30px;}
#single .wrap-pd .col-1{width: 15%;padding: 10px; text-align: center}
#single .wrap-pd .col-2{width: 85%;padding: 10px}
#single .wrap-pd .wrap-txt{border:solid 1px #eee; border-radius: 5px; box-shadow: 1px 1px 3px #ddd;padding: 30px}
#single .wrap-pd .col-2 .pd-name{font-size: 24px;border-bottom:solid 1px #333; padding-bottom: 10px; margin-bottom: 10px}
#single .wrap-pd .col-2 .desc{font-size: 16px;line-height: 180%}

#single .wrap-bts{font-size: 0}
#single .wrap-bts a{display: inline-block;width: 48%; padding: 20px; text-align: center; color:#fff; background-color: rgba(36,74,115,1.00); margin: 0px 1% 50px; font-size: 18px;box-shadow: 2px 2px 3px #666; }



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

#single .wrap-pd .col{width: 100%; display: block}
#single .wrap-pd .col-1 img{max-height:200px; width: auto}
#single .wrap-pd .col-2 .pd-name{font-size: 18px}
#single .wrap-pd .col-2 .desc{font-size: 14px}
#single .wrap-bts a{font-size: 14px}

}


.wrap-pd-cat{margin: 30px auto}
.wrap-pd-cat .col{text-align: center;padding: 10px}
.wrap-pd-cat .col .pd-name{color:#fff; background-color: rgba(36,74,115,1.00);  font-size: 16px;border-radius: 5px; padding: 15px;margin-bottom: 10px}
.wrap-pd-cat .col img{max-height: 250px}
.wrap-pd-cat .col .bt{color:#fff; background-color: rgba(36,74,115,1.00);  font-size: 16px;border-radius: 5px; padding: 15px;margin-top: 10px}
.wrap-pd-cat .col a{display: block}



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

.wrap-pd-cat .col{width: 50%}
.wrap-pd-cat .col .pd-name{font-size: 14px}
.wrap-pd-cat .col .bt{font-size: 14px}


}