/*! HTML5 Boilerplate v6.1.0 | MIT License | https://html5boilerplate.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {    color: #222;   font-size: 1em;    line-height: 1.4;}

::-moz-selection {    background: #b3d4fc;    text-shadow: none;}
::selection {    background: #b3d4fc;    text-shadow: none;}

hr {    display: block;    height: 1px;    border: 0;    border-top: 1px solid #ccc;    margin: 1em 0;    padding: 0;}

audio,canvas,iframe,img,svg,video {    vertical-align: middle;}
fieldset {    border: 0;    margin: 0;    padding: 0;}
textarea {    resize: vertical;}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */
.browserupgrade {    margin: 0.2em 0;    background: #ccc;    color: #000;    padding: 0.2em 0;}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/* --------------------------------
  common settings
-------------------------------- */
body{ font-size:16px; line-height:170%; color:#333; margin:0; padding:0;
  font-family: "Yu Gothic", YuGothic,'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3',Meiryo, メイリオ, sans-serif;
}

h1,h2,h3,h4,h5,h6,p,ul,dl,ol{margin-top: 0;}
img{max-width: 100%; height: auto;}

/* link color */
a			{ color:#E77D27;}
a:hover		{ color:#FF0F0F;}
a:visited	{ color:#A85613;}

.memo{ color:#999;}

.bgGray   { color: #F4F4F4;}
.bgBlue   { color: #F2F6FA;}

.txtGray  { color: #8E8E8E;}
.txtBlue  { color: #1864A9;}
/* .txtGreen { color: #4E8A46;} */
.txtGreen { color: #008c3f;}
.txtRed   { color: #CD102E;}

.spDisp{ display: none;}
@media (max-width: 640px) {
    .pcDisp{ display: none;}
    .spDisp{ display: Block;}
}

.spWrap { display: inline-block;}

.spTable th,
.spTable td{ padding: 5px 15px;}
.spTable th{ white-space: nowrap; text-align: left; vertical-align: top;}
@media (max-width: 640px) {
    .spTable th { display: block; padding-bottom: 0;}
    .spTable td { display: block; padding-top: 0;}
}


/* --------------------------------
  structur
-------------------------------- */
.struct{ max-width:1200px; box-sizing: border-box; margin-left: auto; margin-right: auto; padding-left: 15px; padding-right: 15px;}

.w560{ max-width: 560px; margin-left: auto; margin-right: auto;}
.w780{ max-width: 780px; margin-left: auto; margin-right: auto;}
.w900{ max-width: 900px; margin-left: auto; margin-right: auto;}

/* header
-------------------------------- */
header { padding: 15px 0 10px; border-bottom: 2px solid #c1c1c1;}
header h1{ float: left; margin: 0 0 15px;}
header .headerSub{ float: right;}
header .headerSub p{ display: inline-block; margin-bottom: 8px; margin-left: 15px;}

header nav{ clear: both; text-align: center;}
header nav ul{ margin: 0; padding: 0; list-style: none;}
header nav ul li{ display: inline-block; margin: 0; padding: 0;}
header nav ul li a{ display: inline-block; margin: 5px 5px 5px ; padding: 5px 15px; background-color: #f4f4f4; font-size: 13px; color: #333; text-decoration: none;}
header nav ul li a span{ font-size: 14px; font-weight: bold;}
header nav ul li a:visited{ color: #333;}
header nav ul li a:hover{ background-color: #F2F6FA; color: #1864A9;}

header #spMenu{ display: none; width: 35px; height: 35px; position: fixed; right: 10px; top: 10px; cursor: pointer; z-index: 99999;    background: url(/common/img/icon_menu_bk.png) no-repeat center ;    background-size: contain;}
header #spMenu.open{ background-image: url(/common/img/icon_menu_bk_close.png);  }

@media (max-width: 840px) {
    header h1{ float: none; max-width: 60%; }
    header .headerSub{ float: none; text-align: center;}
    header .headerSub p{ margin: 0 15px 15px;}
}
@media (max-width: 640px) {
    header #spMenu{ display: block;}
    header .headerSub .tel     { width: 183px;}
    header .headerSub .contact { width: 120px;}
    header .headerSub p{ margin: 0 5px 15px;}
    header nav{ display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; box-sizing: border-box; padding-top: 100px ; background: url(/common/img/mark_logo@2x.png) no-repeat center 28px #fff; background-size: 50px 50px; background-color: rgba(255,255,255,0.95); z-index: 9999;}
    header nav ul { margin: 0 30px;}
    header nav ul li{ display: block; margin-bottom: 5px;}
    header nav ul li a{ display: block; margin: 0;padding: 10px 35px 10px 10px; border: 1px solid #ccc; border-radius: 5px; background: url(/common/img/icon_arrow_spmenu.png) no-repeat right center #f4f4f4; text-align: left; font-size: 14px; }
    header nav ul li a span{ font-size: 16px; display: inline-block;}
}


/* bread
-------------------------------- */
.bread{ text-align: right;}
.bread ul{ list-style: none;margin: 13px 0; padding: 0;}
.bread ul li{ display: inline-block; margin: 0 0 0 13px; font-size: 13px; color: #1864A9;}
    .bread ul li:after{ content: '/';}
    .bread ul li:last-child:after{ content: ''; color: #333;}
.bread ul li a{ margin-right: 13px; color: #333; text-decoration: none;}
    .bread ul li a:hover{ color: #FF0F0F; text-decoration: underline;}

/* main
-------------------------------- */
.main { padding-top:30px; }
.main section .inner{max-width: 890px; box-sizing: border-box; margin-left: auto; margin-right: auto;  padding-left: 15px; padding-right: 15px;  }

/* pageTtl */
.main .pageTtl{ text-align: center; margin-bottom: 30px;}
.main .pageTtl h2{ display: inline-block; background: url(/common/img/bg_pageTtl.png) no-repeat left bottom; padding: 13px ; font-size: 30px;}
.main .pageTtl h2 .weak{ display: inline-block; padding-right: 5px; font-size: 17px; color: #999;}

@media (max-width: 640px) {
.main .pageTtl h2{  padding: 13px 3px ;}
}


/* secTtl */
.main .secTtl{  margin-bottom: 35px; font-size: 22px; line-height: 1.4; font-weight: bold; text-align: center; color: #008c3f;
	font-family:"游明朝体", "Yu Mincho", YuMincho,'ヒラギノ明朝 Pro W3','Hiragino Mincho Pro','ＭＳ Ｐ明朝','MS PMincho',serif;
}
.main .secTtl:before{ content: "－　";}
.main .secTtl:after{ content: "　－";}

/* pageLead */
.pageLead{ background-color: #F4F4F4; padding: 30px 0; margin-bottom: 30px; }
.pageLead p:last-child{ margin-bottom: 0; }


/* footer
-------------------------------- */
footer{ border-top: 2px solid #c1c1c1; padding:30px 0 0; }
footer h2{ float: left; width: 331px;}
footer .footerBody{ overflow: hidden;}
footer .footerBody .footerSub{ }
footer .footerBody .footerSub a{ display: inline-block; margin-bottom: 8px; margin-right: 15px; }
footer .footerBody ul{ list-style: none; margin: 0; padding: 0;}
footer .footerBody ul li{ display: inline-block; margin-right: 20px; padding-left: 12px; background: url(/common/img/icon_arrow01gray.png) no-repeat left center; font-size: 14px;}
footer .footerBody ul li a{ color: #333; text-decoration: none; }
    footer .footerBody ul li a:hover{ color: #FF0F0F; text-decoration: underline; }
footer .copy{ margin: 13px 0; color: #8e8e8e; text-align: center; }
footer .copy small{ font-size: 13px; }

/* toTop */
.toTop{ position: fixed; right: 10px; bottom: 10px;}

@media (max-width: 840px) {
    footer .footerBody .footerSub .tel     { width: 183px;}
    footer .footerBody .footerSub .contact { width: 120px;}
}
@media (max-width: 740px) {
    footer h2{ float: none; width: inherit; text-align: center;}
    footer .footerBody .footerSub { text-align: center;}
}

/* --------------------------------
  pages
-------------------------------- */

/* single / archive
-------------------------------- */
.entryDate{ text-align: right;}
.entryIMG{ text-align: center;}

/* home
-------------------------------- */
.home .main { padding-top: 0;}

/* mainvis */
.home .mainvis {background-color: #f4f4f4; overflow: hidden;}
.home .mainvis .struct {padding-left: 0; padding-right: 0;}
.home .mainvis .pic img,
.home .mainvis .mark img{ /*  max-width: inherit; */}
.home .mainvis .mark { margin-top: -48px; margin-bottom: 0; }

/* sec01 */
.home .sec01{background-color: #f4f4f4; text-align: center; padding-top: 60px; padding-bottom: 40px; font-weight: bold;}

/* sec02 */
.home .sec02{padding-top: 60px; padding-bottom: 40px; background: url(/common/img/home_theme_bg.png) no-repeat center center #008c3f; background-size: contain; color: #fff;}
.home .sec02 .struct{ position: relative;}
.home .sec02 .struct .mark01{ position: absolute; top: -85px; left:30px; }
.home .sec02 .struct .mark02{ position: absolute; bottom:-95px; right: 30px;}
@media (max-width: 740px) {
    .home .sec02 .struct .mark01,
    .home .sec02 .struct .mark02{ display: none;}
}

/* sec03 */
.home .sec03 { padding-top: 60px; padding-bottom: 40px; }

/* worksBox */
.worksBox .item{max-width:345px; }
.worksBox .item p,
.worksBox .item h4 {margin-bottom: 5px;}
.worksBox .item .exp {margin-top: 10px;}
.worksBox .item .pic {text-align: center;}
.worksBox .item .date {font-size: 13px; color: #8E8E8E;}
.worksBox .item .date .ct { display: inline-block; margin-right: 8px; padding: 2px 15px; background-color: #008c3f; color: #fff; line-height: 1.2;}
@media (max-width: 900px) {
    .flexBox.worksBox .item{ margin: 0 10px 30px;}

}

/* sec04 */
.home .sec04 { padding-top: 60px; padding-bottom: 40px; background-color: #F4F4F4; }
.home .sec04 { }

/* newsBox */
.newsBox dt{ line-height: 1.6;}
.newsBox dd{margin-left:7em;margin-top:-1.6em; padding-left: 2em; padding-bottom:0.75em;background: url(/common/img/icon_arrow01green.png) no-repeat left 8px; line-height: 1.6;}
@media (max-width: 640px) {
    .newsBox dd{margin-left:0;margin-top:0; padding-left: 1em;  }
}


/* 補助金省エネ改修工事 energy-saving 
-------------------------------- */
/* sec01 */
.energy-saving .sec01{ background-color: #F4F4F4; padding: 30px 0;}
.energy-saving .sec01 p:last-child{ margin-bottom: 0;}
.energy-saving .sec01 .struct{ max-width: 790px;}
/* sec02 */
.energy-saving .sec02{ padding: 60px 0; color: #1864A9;}
.energy-saving .sec02 .struct{ max-width: 855px; box-sizing: content-box;}
.energy-saving .sec02 h3{ color: #1864A9;}
.energy-saving .sec02 .item { width: 255px; box-sizing: border-box; margin: 0 15px 30px; padding: 30px; background-color: #F2F6FA;}
.energy-saving .sec02 .item h4 { text-align: center; font-size: 18px; line-height: 1.6;}
    .energy-saving .sec02 .item.second h4{ padding-top: 0.8em; padding-bottom: 0.8em;}
.energy-saving .sec02 .item .img { text-align: center;}
.energy-saving .sec02 .item .txt { margin-bottom: 0;}
/* sec03 */
.energy-saving .sec03{ padding: 60px 0; background-color: #F4F4F4;}
.energy-saving .sec03 .struct{ max-width: 855px; box-sizing: content-box;}
.energy-saving .sec03 .item { width: 255px; box-sizing: border-box; margin: 0 15px 30px;}
.energy-saving .sec03 .item h4 { margin-bottom: 5px; font-size: 18px; line-height: 1.6; color: #008c3f;}
.energy-saving .sec03 .item .img { margin-bottom: 5px; text-align: center;}
.energy-saving .sec03 .item .txt { margin-bottom: 0;}
/* sec04 */
.energy-saving .sec04{ padding: 60px 0; }
.energy-saving .sec04 .struct{ max-width: 920px; box-sizing: content-box;}
.energy-saving .sec04 .exBox { border-top: 10px solid #1864A9; background-color: #F2F6FA; padding: 60px; }
.energy-saving .sec04 .exBox .boxTtl{ margin-bottom: 60px; font-size: 22px; font-weight: bold; text-align: center;}
.energy-saving .sec04 .exBox .memo{ margin: 20px 0 0; font-size: 14px; line-height: 1.6; color: #666; text-align: right;}
.energy-saving .sec04 .box01 { flex-wrap: nowrap; align-items: flex-end; }
.energy-saving .sec04 .box01 .item { margin: 0; }
.energy-saving .sec04 .box01 .item.item01 { max-width: 525px; margin-right: 20px; }
.energy-saving .sec04 .box01 .item.item02 { max-width: 261px; }
.energy-saving .sec04 .box02 { border:2px solid #008c3f; padding: 0 25px 25px; background-color: #fff;}
.energy-saving .sec04 .box02 h4{ margin: 0 -25px 25px; padding:8px; background-color: #008c3f; color: #fff; text-align: center;}
.energy-saving .sec04 .box02 .ttl{ font-weight: bold;}
.energy-saving .sec04 .box02 .flexBox { flex-wrap: nowrap;}
.energy-saving .sec04 .box02 .flexBox .item { margin: 0;}
.energy-saving .sec04 .box02 .flexBox .item01 { max-width: 466px; margin-right: 20px;}
.energy-saving .sec04 .box02 .flexBox .item02 { max-width: 286px;}
@media (max-width: 840px) {
    .energy-saving .sec04 .exBox { padding: 30px; }
}
@media (max-width: 640px) {
    .energy-saving .sec04 .box01 { flex-wrap: wrap; justify-content: center;}
    .energy-saving .sec04 .box01 .item.item01 { margin-right: 0px; margin-bottom: 30px; }
    .energy-saving .sec04 .box02 .flexBox { flex-wrap: wrap; justify-content: center;}
    .energy-saving .sec04 .box02 .flexBox  .item.item01 { margin-right: 0px; margin-bottom: 30px; }
}
/* sec05 */
.energy-saving .sec05{ padding: 60px 0; background-color: #F4F4F4;}
.energy-saving .sec05 .struct{ max-width: 855px; box-sizing: content-box;}

.energy-saving .sec05 .item{ margin-bottom: 20px; padding: 20px; background-color: #fff;}
.energy-saving .sec05 .item p{ margin-bottom: 0;}
.energy-saving .sec05 .item p.ttl{ margin-bottom: 10px; font-size: 18px; font-weight: bold;}
.energy-saving .sec05 .item p.ttl span{ display: inline-block; padding-right: 10px;}

/* 医療福祉施設の退去時リニューアル施工 restoration-work 
-------------------------------- */
/* sec01 */
.restoration-work .sec01{ background-color: #F4F4F4; padding: 30px 0;}
.restoration-work .sec01 p:last-child{ margin-bottom: 0;}
.restoration-work .sec01 .struct{ max-width: 790px;}
/* sec02 */
.restoration-work .sec02{ padding: 60px 0; color: #1864A9;}
.restoration-work .sec02 .struct{ max-width: 855px; box-sizing: content-box;}
.restoration-work .sec02 h3{ color: #1864A9;}
.restoration-work .sec02 .item { width: 255px; box-sizing: border-box; margin: 0 15px 30px; padding: 30px; background-color: #F2F6FA;}
.restoration-work .sec02 .item h4 { text-align: center; font-size: 18px; line-height: 1.6;}
.restoration-work .sec02 .item .img { text-align: center;}
.restoration-work .sec02 .item .txt { margin-bottom: 0;}

/* sec03 */
.restoration-work .sec03{ background-color: #F4F4F4; padding: 60px 0; }
.restoration-work .sec03 .struct{ max-width: 920px; box-sizing: content-box;}
.restoration-work .sec03 .exBox { border:2px solid #008c3f; margin-bottom: 30px; padding: 0 25px 25px; background-color: #fff;}
.restoration-work .sec03 .exBox h4{ margin: 0 -25px 25px; padding:8px 25px; background-color: #008c3f; color: #fff;}
.restoration-work .sec03 .exBox .flexBox{ flex-wrap: nowrap; justify-content: center;}
.restoration-work .sec03 .exBox .item{ margin: 0 0 0 25px; text-align: center;}
    .restoration-work .sec03 .exBox .item:first-child{ margin-left: 0;}
.restoration-work .sec03 .exBox .item p{ margin-bottom: 3px;}
.restoration-work .sec03 .exBox .item .caption{ font-size: 14px;}

@media (max-width: 640px) {
    .restoration-work .sec03 .exBox .flexBox{ flex-wrap: wrap;}
    .restoration-work .sec03 .exBox .item{ margin: 0 5px 15px 5px;}
}

/* sec04 */
.restoration-work .sec04{ padding: 60px 0; }
.restoration-work .sec04 .struct{ max-width: 855px; box-sizing: content-box;}

.restoration-work .sec04 .item{ margin-bottom: 20px; padding: 20px; background-color: #F4F4F4;}
.restoration-work .sec04 .item p{ margin-bottom: 0;}
.restoration-work .sec04 .item p.ttl{ margin-bottom: 10px; font-size: 18px; font-weight: bold;}
.restoration-work .sec04 .item p.ttl span{ display: inline-block; padding-right: 10px;}


/* 会社情報・地図 company 
-------------------------------- */
/* sec01 */
.company .sec01{ background-color: #F4F4F4; padding: 60px 0;}

/* sec02 */
.company .sec02{ padding: 60px 0;}
.company .sec02 iframe{ width: 100%;}


/* お問い合わせ contact 
-------------------------------- */
.contact .must{ color:#f00; font-size: 14px;}
.contact input,
.contact textarea { min-width: 240px; max-width: 100%; width:100%; box-sizing: border-box;}
.contact .submit { padding: 40px 0; text-align: center;}
.contact .submit input{ width: inherit;}

input.error{background-color:#fdd;}
label.error{display:inline-block;padding:2px 15px;background-color:#f00;color:#fff;font-size: 13px; line-height:1.2; border-radius: 10px;}

/* 

  



.bgGray   { color: #F4F4F4;}
.bgBlue   { color: #F2F6FA;}

.txtGray  { color: #8E8E8E;}
.txtBlue  { color: #1864A9;}
.txtGreen { color: #008c3f;}
.txtRed   { color: #CD102E;}

a			{ color:#E77D27;}
a:hover		{ color:#FF0F0F;}
a:visited	{ color:#A85613;}

*/

/* ページ送り CSS */
.pagenavi{padding:27px 0; font-size:12px; font-weight:bold; line-height:1; text-align: center;}
.pagenavi a,
.pagenavi span{ display:inline-block; padding:8px 16px;margin-left:5px;margin-bottom:5px;
    background:#F2F6FA;text-decoration:none;color:#1864A9;transition: all 0.3s;
    border-radius:3px; -moz-border-radius:3px;-webkit-border-radius:3px; }
.pagenavi a:hover{ opacity: 0.7;}
.pagenavi span{border:1px solid #1864A9;background-color:#FFF;color:#1864A9;}
.pagenavi span.dots{border:0;background-color:#F2F6FA;}



/* ============================================
     utility
   ============================================ */
   
/*  align
-------------------------------- */
.txtAlignLeft{ text-align:left !important;}
.txtAlignRight{ text-align:right !important;}
.txtAlignCenter{ text-align:center !important;}


/*  flexBox
-------------------------------- */
.flexBox{display: flex; flex-wrap: wrap;}
.flexBox.center {justify-content: center;}

.flexBox .item{ margin: 0 30px 30px;}

@media (max-width: 640px) {
}

/*  floatBox
-------------------------------- */
.floatBox:before,
.floatBox:after {    content: " ";    display: table;}
.floatBox:after {    clear: both;}
.floatBox {    *zoom: 1;}

.floatBox .imgLeft{ float:left; margin:0 30px 30px 0;}
.floatBox .imgRight{ float:right; margin:0 0 30px 30px;}
.floatBox .txtFloat{}
.floatBox .txtStop{ overflow:hidden;}

@media (max-width: 640px) {
  .floatBox .imgLeft,
  .floatBox .imgRight{ float:none; margin:0 auto 30px; text-align:center;}
}

/* button
-------------------------------- */
/* btn01 */
a.btn01{ display: block; border:1px solid #008c3f; padding: 10px; text-align: center;font-size: 18px; line-height: 1.2;text-decoration: none; color: #008c3f;
	font-family:"游明朝体", "Yu Mincho", YuMincho,'ヒラギノ明朝 Pro W3','Hiragino Mincho Pro','ＭＳ Ｐ明朝','MS PMincho',serif;}
a.btn01:hover{ opacity: 0.8; }

/* btn02 */
.btn02 { text-align: center;}
.btn02 a,
.btn02 input
{ display: inline-block; padding: 15px 60px; border: 0; background-color: #1864A9; color: #fff; line-height: 1.2;text-decoration: none; cursor: pointer;}
    .btn02 a:hover,
    .btn02 input:hover{ opacity: 0.8;}

/* btns */
.btns .item{ min-width: 48%; box-sizing: border-box; margin: 0 0 15px;}
.btns .item:first-child{ margin-right: 4%; }
.btns .item a{ display: block; padding: 5px 15px; background-color: #008c3f; color: #fff;font-size: 16px; color: #fff; text-decoration: none;font-weight: bold; text-align: center;}
.btns .item a .weak{ padding-right: 3px; font-size: 14px; font-weight: normal;}
.btns .item a:hover{ opacity: 0.8;}
@media (max-width: 740px) {
    .btns .item{ width: 100%;}
    .btns .item:first-child{ margin-right: 0; }
}


/*  font-size
-------------------------------- */
.font10{ font-size:10px !important;}
.font11{ font-size:11px !important;}
.font12{ font-size:12px !important;}
.font13{ font-size:13px !important;}
.font14{ font-size:14px !important;}
.font15{ font-size:15px !important;}
.font16{ font-size:16px !important;}
.font17{ font-size:17px !important;}
.font18{ font-size:18px !important;}
.font19{ font-size:19px !important;}
.font20{ font-size:20px !important;}
.font22{ font-size:22px !important;}
.font24{ font-size:24px !important;}
.font26{ font-size:26px !important;}
.font28{ font-size:28px !important;}
.font30{ font-size:30px !important;}
.font32{ font-size:32px !important;}
.font34{ font-size:34px !important;}
.font36{ font-size:36px !important;}
.font38{ font-size:38px !important;}
.font40{ font-size:40px !important;}

/*  margin
-------------------------------- */
/*top*/
.mt00{margin-top:0 !important;}
.mt05{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;}
.mt35{margin-top:35px !important;}
.mt40{margin-top:40px !important;}
.mt45{margin-top:45px !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;}

/*right*/
.mr00{margin-right:0 !important;}
.mr05{margin-right:5px !important;}
.mr08{margin-right:8px !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;}
.mr35{margin-right:35px !important;}
.mr40{margin-right:40px !important;}
.mr45{margin-right:45px !important;}
.mr50{margin-right:50px !important;}

/*bottom*/
.mb00{margin-bottom:0 !important;}
.mb05{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;}
.mb35{margin-bottom:35px !important;}
.mb40{margin-bottom:40px !important;}
.mb45{margin-bottom:45px !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;}

/*left*/
.ml00{margin-left:0 !important;}
.ml05{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;}
.ml35{margin-left:35px !important;}
.ml40{margin-left:40px !important;}
.ml45{margin-left:45px !important;}
.ml50{margin-left:50px !important;}

/* both side */
.ms00{margin-left:0 !important; margin-right:0 !important;}
.ms05{margin-left:5px !important; margin-right:5px !important;}
.ms10{margin-left:10px !important; margin-right:10px !important;}
.ms15{margin-left:15px !important; margin-right:15px !important;}
.ms20{margin-left:20px !important; margin-right:20px !important;}
.ms25{margin-left:25px !important; margin-right:25px !important;}
.ms30{margin-left:30px !important; margin-right:30px !important;}
.ms35{margin-left:35px !important; margin-right:35px !important;}
.ms40{margin-left:40px !important; margin-right:40px !important;}
.ms45{margin-left:45px !important; margin-right:45px !important;}
.ms50{margin-left:50px !important; margin-right:50px !important;}

/*  padding
-------------------------------- */
/*top*/
.pt00{padding-top:0 !important;}
.pt05{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;}
.pt35{padding-top:35px !important;}
.pt40{padding-top:40px !important;}
.pt45{padding-top:45px !important;}
.pt50{padding-top:50px !important;}

/*right*/
.pr00{padding-right:0 !important;}
.pr05{padding-right:5px !important;}
.pr08{padding-right:8px !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;}
.pr35{padding-right:35px !important;}
.pr40{padding-right:40px !important;}
.pr45{padding-right:45px !important;}
.pr50{padding-right:50px !important;}

/*bottom*/
.pb00{padding-bottom:0 !important;}
.pb05{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;}
.pb35{padding-bottom:35px !important;}
.pb40{padding-bottom:40px !important;}
.pb45{padding-bottom:45px !important;}
.pb50{padding-bottom:50px !important;}

/*left*/
.pl00{padding-left:0 !important;}
.pl05{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;}
.pl35{padding-left:35px !important;}
.pl40{padding-left:40px !important;}
.pl45{padding-left:45px !important;}
.pl50{padding-left:50px !important;}

/* both side */
.ps00{padding-left:0 !important; padding-right:0 !important;}
.ps05{padding-left:5px !important; padding-right:5px !important;}
.ps10{padding-left:10px !important; padding-right:10px !important;}
.ps15{padding-left:15px !important; padding-right:15px !important;}
.ps20{padding-left:20px !important; padding-right:20px !important;}
.ps25{padding-left:25px !important; padding-right:25px !important;}
.ps30{padding-left:30px !important; padding-right:30px !important;}
.ps35{padding-left:35px !important; padding-right:35px !important;}
.ps40{padding-left:40px !important; padding-right:40px !important;}
.ps45{padding-left:45px !important; padding-right:45px !important;}
.ps50{padding-left:50px !important; padding-right:50px !important;}









/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden {
    display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    white-space: nowrap; /* 1 */
}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
    white-space: inherit;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 1.25dppx),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   https://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important; /* Black prints faster */
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre {
        white-space: pre-wrap !important;
    }
    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    /*
     * Printing Tables:
     * http://css-discuss.incutio.com/wiki/Printing_Tables
     */

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}