@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Overpass:600i');
/*----------------------------------------------------------------- 
リセット
----------------------------------------------------------------- */
*,
*:after,
*:before {
	margin:0;
	padding:0;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
	border: 0;
	outline: 0;
	 -webkit-appearance: none;
}
ol, ul,li{ list-style: none; margin:0; padding:0;}

:focus,
:active { outline:0;}
table {
	border-collapse: collapse;
	border-spacing: 0;
	}
th, 
td { padding:8px; line-height:1.4em;}
input{ margin-right:5px;}	
.switch {
	visibility: hidden;
}

body{
	margin:0;
	padding:0;
	font:16px/1.8 "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
	letter-spacing: 0.03em;
	color:#111;
	}
h1, h2, h3, h4, h5, h6, p,dt ,dl,dd{ font-size:inherit; margin:0; padding:0; }
/*p { text-indent: 1em; }*/
hr{ display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0; }
ul{ list-style:none; margin:0; padding:0; }
li{ margin:0; padding:0; }
@media screen and (min-width: 360px) { * { -webkit-text-size-adjust: none; } }


/*----------------------------------------------------
 clearfix
----------------------------------------------------*/

.clearfix:after,
.header:after,
.contents:after,
#headerIn:after,
.headerRight:after,
.gNavi ul:after,
.infoWrap:after,
.boxCol4:after,
#footerIn:after,
.footerLinks:after,
.access:after,
.access .imgBox:after,
.btnTopService:after{ content: ".";display:block;height:0.1px;clear:both;visibility:hidden;font-size:0.1em;line-height:0; }
.clearfix,
.header,
.contents,
#headerIn,
.headerRight,
.infoWrap,
.boxCol4,
#footerIn,
.footerLinks,
.access,
.access .imgBox,
.btnTopService{ display:inline-block;overflow:hidden;_overflow:visible;display:block; }
* html .clearfix,
* html .header,
* html .contents,
* html #headerIn,
* html .headerRight,
* html .gNavi ul,
* html .infoWrap,
* html .boxCol4,
* html #footerIn,
* html .footerLinks,
* html .access,
* html .access .imgBox,
* html .btnTopService{ height:1%; }


/* ----------- anchor */
a { color:#111; text-decoration:none;}
a:hover,
a .imgbt:hover{opacity:0.5;filter:alpha(opacity=50);cursor:pointer;}
a { -webkit-tap-highlight-color: rgba(0,0,0,0); }



/*********************************************************************

PC-Layout

**********************************************************************/
.pcnone{display:none;}
.spnone{display:block;}

.inner,
#headerIn,
#footerIn{width: 1000px; margin-left: auto; margin-right: auto;}

section{padding:60px 0;}

.boxHalf{width: 48%;}
.box320{width: 320px;}
.box660{width: 660px;}

.bgWhite{background:#fff;}
.bgGray{background:url(assets/img/common/bg_gray.png);}

.pc30sp10{margin-bottom: 30px;}
.pc40sp20{margin-bottom: 40px;}

.fl { float:left;}
.fr { float:right;}

.boxCol4 li{float:left; width: 235px; margin-right: 20px;}
.boxCol4 li:nth-child(4n){margin-right: 0;}

.link01{text-decoration:underline;}
.link01:after{content:"\f08e"; padding-left: 5px; font-family: FontAwesome; font-size:0.8em;}

.link02{text-decoration:underline;}

#pagetop{position:fixed; bottom:3px; right:30px; display: block; width: 44px; height: 44px;}
#pagetop img{width: 100%;}


/*----------------------------------------------------
 	header
----------------------------------------------------*/
#headerIn{padding:20px 0;}
#headerLogo{width: 458px; float:left;}
#headerLogo img{width: 100%;}
.headerRight{width: 380px; float:right;}
.headerContact{width: 160px; float:left;}
.headerTel{width: 194px; float:right;}

.gNavi{padding:28px 0 20px; display: block;}
.gNavi li{float:left; width: 136px; text-align:center; }
.gNavi li a{display: block; padding-top: 4px;}
.gNavi li img{display: inline;}
.gNavi li span{display: none;}
.gNavi li.gNav01{width: 81px; text-align:left;}
.gNavi li.gNav07{width: 103px; text-align:right; position:relative;}
.gNavi li.gNav03 a{padding-top: 2px;}
.gNavi li.gNav04 a{padding-top: 8px;}

@media only screen and (min-width: 668px){
.gNaviChild{width: 162px; background:#fff; position:absolute; padding-top: 20px; top:100%; left:50%; margin-left:-70px; z-index:99; }
.gNaviChild li a{display: none;}
.gNavi li.gNav07:hover{}
.gNavi li.gNav07:hover .gNaviChild{overflow: visible;}
.gNavi li.gNav07:hover .gNaviChild li{width: 100%; border-bottom: 1px solid #ddd;}
.gNavi li.gNav07:hover .gNaviChild li a{display: block; padding:5px;}
}

.isFixed{
position: fixed;
top: 0;
left: 0;
display: block;
width: 100%;
background: #fff !important;
border-bottom: 1px solid #eee;
z-index:9999;
margin-top: -28px;
-webkit-transition: all .3s;
transition: all .3s;
overflow:hidden;
}
.isFixed #headerIn {padding: 10px 0 0;}
.isFixed #headerLogo {width: 258px;}
.isFixed .headerRight {width: 330px;}
.isFixed .headerTel {display: none;}
.isFixed .headerContact {width: 100%;}
.isFixed .headerContact div{float:left;}
.isFixed .headerContact div:first-child{margin-right: 10px;}
.isFixed .gNavi {padding: 0 0 10px;}


/*----------------------------------------------------
 	footer
----------------------------------------------------*/
#footer{background:#111;}

#footer .gNavi{background:#efefef;}

#footerIn{color:#fff; padding:60px 0;}
#footerIn a{color:#fff;}
.footerInRight{padding-top: 20px;}
.footerAccess li{margin-bottom: 20px;}
.footerLinks li{width:50%; float:left;}

#copyright{background:#fff; text-align:center; padding:15px 0; font-size:11px;}

/*----------------------------------------------------
 	見出し
----------------------------------------------------*/
h1{background:#111; color:#fff; font-size:10px; font-weight:normal; padding: 5px 0;}
h2.h201{font-family:'Overpass',"游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN",  sans-serif; font-size:26px; padding-bottom: 10px; margin-bottom: 20px; border-bottom: 3px solid; position:relative; line-height:1;}
h2.h202{font-family:'Overpass',"游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN",  sans-serif; font-size:24px; padding:10px 15px; margin-bottom: 20px; border-bottom: 5px solid #CCC; background: #EEE; }
h3.h301{font-family:'Overpass', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif; font-size:22px; background:#111; padding:10px 15px; color:#fff; margin-bottom: 30px; position:relative;}
h4.h401{font-family:'Overpass', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif; font-size:18px; border-left:6px solid #111; padding-left: 10px; margin-bottom: 10px; font-weight:bold;}
h4.h402{font-family:'Overpass', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif; font-size:14px; border-left:6px solid #000; padding-left: 10px; margin-bottom: 10px; font-weight:bold;}

/*{font-family: 'Overpass', sans-serif;}*/

/*----------------------------------------------------
 	ボタン
----------------------------------------------------*/
.btnMore{font-size:16px;}
.btnMore a:before{content:""; background:url(assets/img/common/icon_btnMore.png) no-repeat 50% 50%; background-size:18px auto; display: inline-block; width: 18px; height: 18px; margin-right: 6px; vertical-align:-3px;}
h2.h201 .btnMore{position:absolute; right:0; bottom:10px;}

h3.h301 .btnMore{position:absolute; right:15px; bottom:15px;}
h3.h301 .btnMore a{color:#fff;}
h3.h301 .btnMore a:before{content:""; background:url(assets/img/common/icon_btnMore02.png) no-repeat 50% 50%; background-size:18px auto; display: inline-block; width: 18px; height: 18px; margin-right: 6px; vertical-align:-3px;}

.h302{font-size:1.2em; font-weight:bold; margin-bottom: 10px;}


/*----------------------------------------------------
 	テーブル
----------------------------------------------------*/
.table01{width: 100%; background:#ddd; border-collapse:separate; border-spacing: 1px;}
.table01 th{width: 200px; background:#efefef; padding: 30px 20px; font-weight:bold; text-align:left;}
.table01 td{background:#fff; padding: 30px 20px;}

.table02{width: 100%; background:#ddd; border-collapse:separate; border-spacing: 1px; border: 2px #000000 solid;}
.table02 th{width: 200px; background:#efefef; padding: 30px 20px; font-weight:bold; text-align:left;}
.table02 td{background:#fff; padding: 30px 20px;}

.table03{width: 100%; background:#ddd; border-collapse:separate; border-spacing: 1px;}
.table03 th{width: 200px; background:#efefef; padding: 10px 20px; font-weight:bold; text-align:left;}
.table03 td{background:#fff; padding: 10px 20px;}


/*----------------------------------------------------
 	リスト
----------------------------------------------------*/
ul.list01{}
ul.list01 li{padding-left: 20px; text-indent:-20px; margin-right: 0; margin-bottom: 5px;}
ul.list01 li:before{content:"■"; margin-right: 5px;}



/*----------------------------------------------------
 	TOP
----------------------------------------------------*/
.mainImgWrap{width: 100%; height: 480px; position:relative;}
.mainImgWrap div{width: 100% !important; height: 100% !important; top:0 !important; background-size:cover !important; background-position:50% 50% !important;}

/*infomation*/
.infoWrap{width: 100%;}
.infoLeft{float:left; width: 210px;}
.infoLeft a img{width: 100%;}

.infoRight{width: 770px; float:right; border:3px solid #111; padding: 20px;}
.infoRight h2.h201{border-bottom: none; padding-bottom: 0;}
.infoRight h2.h201 .btnMore{top:0; bottom:auto;}

.infoList li{margin-bottom: 10px;}
.infoList li:last-child{margin-bottom: 0;}
.infoList .catIcon{width: 90px; height: 25px; line-height:25px; text-align:center; color:#fff; background:#111; margin-right: 10px; display: inline-block; font-size:13px;}
.infoList .catIcon.cat01{background:#111;}
.infoList .catIcon.cat02{background:#b3232b;}
.infoList .catIcon.cat03{background:#111;}
.infoList .catIcon.cat04{background:#111;}
.infoList .date{font-family: 'Overpass', sans-serif; color:#666; font-size:13px; margin-right: 10px;}
.infoList .ttl{width: 300px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; display:inline-block; line-height:25px; vertical-align:middle;}
.infoList a .ttl{text-decoration:underline;}
.infoList .ttl2{width: 545px; /*text-overflow: ellipsis; overflow: hidden; white-space: nowrap; display:grid; line-height:25px;*/}
.infoList a .ttl2{text-decoration:underline;}
/*新着情報
.infoList .catIcon{ color: #FFFFFF; width: 100px; line-height:20px; display: inline-block; text-align:center; color:#fff; font-size:12px; background:#aaa; border-radius:2px; margin-right: 10px;}
.infoList .catIcon.cat01{background:#111111;}
.infoList .catIcon.cat02{background:#b3232b;}
.infoList .catIcon.cat03{background:#111111;}
.infoList .catIcon.cat04{background:#111111;}
.infoList li .ttl{width: 486px; text-overflow:ellipsis; overflow:hidden; white-space: nowrap; display: table-footer-group; vertical-align: middle; display: inline-block;}
.infoList li a .ttl{text-decoration:underline; }*/

/*blog*/
.blogList .imgBox{width: 100%; height:155px; text-align:center; background:#ccc; margin-bottom: 10px; overflow: hidden;}
.blogList .imgBox img{ width: 100%; height: auto;}

/*contact*/
.fbWrap{}


/*----------------------------------------------------
 	グループ概要
----------------------------------------------------*/
/*アクセス情報*/
.access{width: 100%;}
.access .mapBox{width: 680px; height: 410px; float:left; border:1px solid #ddd;}
.access .imgBox{width: 300px; float:right;}
.access .imgBox li{width: 100%; height: 200px; margin-bottom: 10px; text-align:center; background:#efefef; border:1px solid #ddd; overflow:hidden;}
.access .imgBox li:last-child{margin-bottom: 0;}
.access .imgBox li img{width: auto; height:100%;}

/*運営サイト紹介*/
/*-----.table01.website th{width: 500px; text-align: center;}
.table01.website th img{max-width: 300px; display: block; margin: 0 auto;}
.table01.website th a{text-decoration:underline;}
.table01.website th a:after{content:"\f08e"; padding-left: 5px; font-family: FontAwesome; font-size:0.8em;}-----------*/


/*----------------------------------------------------
 	業務内容
----------------------------------------------------*/
.serviceBtn{margin-bottom: 20px;}
.serviceBtn li{width:49%; float:left; margin-right:2%; margin-bottom: 10px;}
.serviceBtn li:nth-child(2n){margin-right:0;}
.serviceBtn li a{display:block; width:100%;}
.serviceBtn li a:before{content:"\f107"; margin-right: 10px; font-family: FontAwesome;}

.pageLink{padding-top: 147px; margin-top: -147px; display: block;}
.toMenu{margin-bottom: 10px;}


/*----------------------------------------------------
 	お問い合わせ
----------------------------------------------------*/
#myForm table{width: 100%; margin-bottom: 60px;}
#myForm table tr{border-bottom: 1px dotted #ddd;}
#myForm table th{width: 315px; padding:40px 0; text-align:left; font-weight:bold;}
#myForm table td{padding:40px 0;}

span.attention,span.option{color:#fff; padding:5px; display:inline-block; text-align:center; margin-right: 10px; width: 40px;}
span.attention{background:#b3232b;}
span.option{background:#35557a;}


/*----------------------------------------------------
 	プライバシーポリシー
----------------------------------------------------*/
.privacy li{text-indent:-1em; margin-left: 1em; margin-bottom: 20px;}
.privacy li ul li{margin-bottom: 0;}


/*----------------------------------------------------
 	サイトマップ
----------------------------------------------------*/
.sitemap li{text-align:left; margin-bottom: 10px; list-style: disc; margin-left: 2em;}
.sitemap li ul li{margin-top: 10px; margin-left: 2em;}

/*----------------------------------------------------
 	パンくず
----------------------------------------------------*/
.breadcrumbs{background:#efefef; padding:5px 0; text-align:right; font-size:0.8571em;}


.wp-pagenavi{text-align:center; margin-top: 10px;}




/*********************************************************************

SP-Layout

**********************************************************************/
@media only screen and (max-width: 667px){

body{
	font:14px/1.8 "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
	}


.pcnone{display:block;}
.spnone{display:none;}

.inner,
#headerIn,
#footerIn{width: 96%;}

section{padding:30px 0;}

.boxHalf,
.box320,
.box660{width: 100%;}

.pc30sp10{margin-bottom: 10px;}
.pc40sp20{margin-bottom: 20px;}

.fl,.fr{float:none;}
.fl{margin-bottom: 10px;}

.boxCol4 li{float:none; width: 100%; margin-right: 0; margin-bottom: 20px;}
.boxCol4 li:nth-child(4n){margin-right: 0; }
.boxCol4 li:last-child{margin-bottom: 0;}

img{max-width: 100%;}

#pagetop{ right:3%;}


/*----------------------------------------------------
 	header
----------------------------------------------------*/
#headerIn{padding:10px 0; height: 60px; padding:10px 0; position:relative;}
#headerLogo{width: auto; height:38px; float:left;}
#headerLogo img{width: auto; height:100%}
.headerRight{display: none;}

.gNavi{padding:10px 0 10px; display: none; background:#fff;}
.gNavi li{float:none; width: 100%; border-bottom: 1px solid #ccc;}
.gNavi li a{padding: 5px;}
.gNavi li img{display: none;}
.gNavi li span{display: block;}
.gNavi li.gNav01{width: 100%; text-align:center;}
.gNavi li.gNav07{width: 100%; text-align:center;}
.gNavi li.gNav03 a{padding-top: 5px;}
.gNavi li.gNav04 a{padding-top: 5px;}
.gNaviChild li{border-top: 1px solid #ccc; border-bottom: none;}

.menu-trigger{width: 40px; height: 40px; background:url(./assets/img/common/spmenu.png) no-repeat 50% 50%; background-size:40px auto; position:absolute; top:10px; right:0;}
.btnContactSP,.btnFbSP{width: 40px; height: 40px; position:absolute; display: block; top: 10px;}
.btnFbSP{right:45px;}
.btnContactSP{right:90px;}
.btnContactSP img,.btnFbSP img{width: 100%;}

.isFixed #headerIn{padding: 10px 0;}


/*----------------------------------------------------
 	footer
----------------------------------------------------*/
#footer .gNavi{display: none;}

#footerIn{padding:30px 0;}
.footerInLeft{margin-bottom: 30px;}
.footerInRight{padding-top: 0;}
.footerAccess li{margin-bottom: 10px;}
.footerLinks li{width:50%; float:left;}


/*----------------------------------------------------
 	見出し
----------------------------------------------------*/
h2.h201{margin-bottom: 10px; padding-bottom: 5px; font-size:20px;}
h3.h301{margin-bottom: 20px; font-size:18px;}

.infoRight h2.h201 .btnMore{right: -9px;}
.infoRight h2.h201 .btnMore a:before{margin-right: 0px;}

/*{font-family: 'Overpass', sans-serif;}*/

/*----------------------------------------------------
 	ボタン
----------------------------------------------------*/


/*----------------------------------------------------
 	テーブル
----------------------------------------------------*/
.table01{width: 100%;}
.table01 th{width: 100%; padding: 10px; display: block;}
.table01 td{width: 100%; padding: 10px; display: block;}

.table03 th,
.table03 td{padding: 10px;}

.spTableWrap{width:100%; overflow:scroll;}
.spTableWrap table{width: 667px;}


/*----------------------------------------------------
 	TOP
----------------------------------------------------*/
.mainImgWrap{height: 260px;}
.mainImgWrap div{background-repeat:no-repeat !important; background-size:cover !important;}

/*infomation*/
.infoWrap{width: 100%;}
.infoLeft{float:none; width: 100%; margin-bottom: 10px;}
.infoLeft img{width: 100%;}
.infoRight{width: 100%; float:none; padding: 10px;}
.infoList li{margin-bottom: 10px;}
.infoList li:last-child{margin-bottom: 0;}
.infoList li .ttl,.infoList li .ttl2{width: 100%; display: block;}

/*BUSSINESS*/
.btnTopService{width: 100%;}
.btnTopService li{width: 32.5%; height: 70px; margin-right: 1%; margin-bottom: 5px; float:left; text-align:center;}
.btnTopService li:nth-child(3n){margin-right: 0;}
.btnTopService li a{display: block; width: 100%; height: 100%; color:#fff; font-size:13px; padding: 12px 0;}
.btnTopService li.line1 a{padding:24px 0;}
.btnTopService li.line3 a{padding:5px 0;}
.btnTopService li a span{font-size:10px;}
.btnTopService li.c01 a{background:#667c5c;}
.btnTopService li.c02 a{background:#6a6172;}
.btnTopService li.c03 a{background:#a58e6b;}
.btnTopService li.c04 a{background:#447e8e;}

/*blog*/
.blogList.boxCol4 li{float:left; width: 49%; margin-right: 2%; margin-bottom: 10px;}
.blogList.boxCol4 li:nth-child(2n){margin-right: 0; }
.blogList.boxCol4 li:nth-child(3),.blogList.boxCol4 li:nth-child(4){margin-bottom: 0;}
.blogList .imgBox{height: auto;}

/*network*/
.networkImg{width: 100%; height: 300px; overflow:scroll; padding-bottom: 10px;}
.networkImg img{max-width: 1000px; width: auto; height: 100%;}


/*contact*/


/*----------------------------------------------------
 	グループ概要
----------------------------------------------------*/
/*アクセス情報*/
.access .mapBox{width: 100%; height: 230px; float:none; margin-bottom: 10px;}
.access .imgBox{width: 100%; float:none;}
.access .imgBox li{width: 49%; height: 120px; float:left; margin-right: 2%;}
.access .imgBox li:last-child{margin-right: 0;}
	
/*運営サイト紹介*/
/*-----------.table01.website th{width: 100%;}
.table01.website th img{ display:  block;}-----------*/


/*----------------------------------------------------
 	業務内容
----------------------------------------------------*/
.serviceBtn li{width:100%; float:none; margin-right:0; margin-bottom: 5px;}
.pageLink{padding-top: 89px; margin-top: -89px;}


/*----------------------------------------------------
 	お問い合わせ
----------------------------------------------------*/
#myForm table{width: 100%;}
#myForm table tr{border-bottom: 1px dotted #ddd;}
#myForm table th{width: 100%; padding:20px 0 10px; display: block;}
#myForm table td{padding:10px 0 20px; width: 100%; display: block;}




}

/* ---------------------------------------------------------
	汎用ボタン
--------------------------------------------------------- */

.btn a,input.btn{
	 -webkit-appearance: none;
	display:block;
	margin:20px auto;
	background:#64B5F6;
	font-size:160%;
	font-weight: bold;
	width: 50%;
	text-align: center;
	padding:10px;
	border-radius: 5px;
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
	color: #fff;
}
.btn a:hover,input.btn:hover{ background:#FF9800;} 


/* ---------------------------------------------------------
	フォーム、フォーム バリデーション
--------------------------------------------------------- */

/* input base */
input, textarea, select {
	padding:10px;
	text-align:left;
	border:1px solid #ddd;
}
input:focus,textarea:focus {
    border:solid 1px #EEA34A;
}
input,select{ min-height:40px;}

input[type=checkbox],
input[type=radio]{ margin-right:5px; }
input[type=text],input[type=tel],input[type=email] { width: 70%; font-size:1em;display:block;}
textarea {  width:98%; font-size:1em;display:block; resize:vertical;}
select{font-size:1em; background:#fff; border-radius:0;}

input[type=text].input1{width: 100%;}
input[type=text].input2{width: 5em;}

label,
input[type=text], 
input[type=tel], 
input[type=checkbox],
input[type=radio] { display:inline;}
 
input.myError,
textarea.myError{ background:#FFFFE6; }
p.myError{ color:#F00; padding-top:10px; font-weight:bolder; display:block; clear:both; }
.caution{background:#e60012; color:#fff; font-size:0.8em; padding:5px; margin-left: 10px;}

.btnContact{width: 240px; max-width: 100%; height: 60px; margin:0 auto 20px; background:url(assets/img/common/icon_right04.png) no-repeat 96% 50%,#111; background-size:8px auto; display: inline-block; color:#fff; font-size:1.1428em; text-align:center;}
.btnContact02{width: 240px; max-width: 100%; height: 60px; margin:0 auto 20px; background:#666; background-size:8px auto; display: inline-block; color:#fff; font-size:1.1428em; text-align:center; margin-right: 20px;}
.btnContact:hover,.btnContact02:hover{opacity:0.5;}
@media only screen and (max-width: 667px){
.btnContact,.btnContact02{display: block;}
.btnContact02{margin-right: auto; margin-bottom: 10px;}
}


input[type=radio],
input[type=checkbox] {
    display: inline-block;
    margin-right: 6px;
	background: #eee;
}
input[type=radio] + label,
input[type=checkbox] + label {
    position: relative;

    display: inline-block;
    margin-right: 12px;

    font-size: 16px;
    line-height: 30px;

    cursor: pointer;
}

@media (min-width: 1px) {
    input[type=radio],
    input[type=checkbox] {
        display: none;
        margin: 0;
    }
    input[type=radio] + label,
    input[type=checkbox] + label {
        padding: 0 0 0 24px;
    }
    input[type=radio] + label::before,
    input[type=checkbox] + label::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;

        -moz-box-sizing: border-box;
        box-sizing: border-box;
        display: block;
        width: 18px;
        height: 18px;
        margin-top: -9px;

	background: #fff;
	border:1px solid #ccc;
    }
    input[type=radio] + label::before {
        border: 2px solid #ccc;
        border-radius: 30px;
    }
    input[type=checkbox] + label::before {
        border: 2px solid #ccc;
    }
    input[type=radio]:checked + label::after,
    input[type=checkbox]:checked + label::after {
        content: "";
        position: absolute;
        top: 50%;

        -moz-box-sizing: border-box;
        box-sizing: border-box;
        display: block;
    }
    input[type=radio]:checked + label::after {
        left: 5px;

        width: 8px;
        height: 8px;
        margin-top: -4px;

        background: #111;
        border-radius: 8px;
    }
    input[type=checkbox]:checked + label::after {
        left: 3px;

        width: 16px;
        height: 8px;
        margin-top: -8px;

        border-left: 3px solid #111;
        border-bottom: 3px solid #111;

        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
}


/* ------------------------------------------------
	　common
    ---------------------------------------------- */

.mb5 { margin-bottom:5px;}
.mb10 { margin-bottom:10px;}
.mb20 { margin-bottom:20px;}
.mb30 { margin-bottom:30px;}
.mb40 { margin-bottom:40px;}
.mb50 { margin-bottom:50px;}
.mb60 { margin-bottom:60px;}
.mb70 { margin-bottom:70px;}
.mb90 { margin-bottom:90px;}

.ml5 { margin-left:5px;}
.ml10 { margin-left:10px;}
.ml12 { margin-left:12px;}
.ml13 { margin-left:13px;}
.ml15 { margin-left:15px;}
.ml20 { margin-left:20px;}
.ml25 { margin-left:25px;}
.ml30 { margin-left:30px;}

.mr5 { margin-right:5px;}
.mr10 { margin-right:10px;}
.mr15 { margin-right:15px;}
.mr20 { margin-right:20px;}
.mr30 { margin-right:30px;}

.mt5 { margin-top:5px;}
.mt10 { margin-top:10px;}
.mt15 { margin-top:15px;}
.mt20 { margin-top:20px;}
.mt30 { margin-top:30px;}
.mt40 { margin-top:40px;}
.mt50 { margin-top:50px;}
.mt60 { margin-top:60px;}

.pt5 { padding-top:5px;}
.pt10 { padding-top:10px;}
.pt20 { padding-top:20px;}
.pt30 { padding-top:30px;}
.pt40 { padding-top:40px;}

.pb5 { padding-bottom:5px;}
.pb10 { padding-bottom:10px;}
.pb20 { padding-bottom:20px;}
.pb100{ padding-bottom: 100px;}

.text10{ font-size:72%; }
.text11{ font-size:79%; }
.text12{ font-size:86%; }
.text13{ font-size:93%; }
.text14{ font-size:100%; }
.text16{ font-size:115%; }
.text18{ font-size:129%; }
.text20{ font-size:143%; }
.text24{ font-size:172%; }
.text28{ font-size:200%; }
.text30{ font-size:214%; }
.textC { text-align:center;}
.textR { text-align:right;}
.textL{ text-align: left;}
.textB { font-weight:bolder;}

.red { color:#b3232b;}

.box10p { width: 10%;}
.box15p { width: 15%;}
.box20p { width: 20%;}
.box35p { width: 35%;}
.box40p { width: 40%;}
.box45p { width: 45%;}
.box49p { width: 49%;}
.box50p { width: 50%;}
.box55p { width: 55%;}
.box60p { width: 60%;}
.box80p { width: 80%;}

.lrAuto{ margin-left:auto; margin-right:auto;}

.link a{ color:#FD7E33; text-decoration:underline; font-weight:bold;}
.link a:hover{ text-decoration:none;}

.va_b{ vertical-align:bottom;}
.va_m{ display:inline-block;vertical-align:middle;}
