/*===========================
additional css elements 
===========================*/

@font-face {
 font-family: 'hanaminaregular';
 src: url('../fonts/HanaMinA_weight.ttf') format('truetype');
}
.minchouFontClass {
	font-family: "hanaminaregular";
}
.catch.minchouFontClass span {
	font-weight: normal;
	font-size: 70%;
	color: #333;
	line-height: 1.5em;
	display: block;
}
.content {
	border-bottom:#306CE9 2px solid;
}
.bgcolor3 {
	padding:50px 0;
	background-color:#fff;
	background-image:url(../img/common/bg_eco.jpg);
	background-repeat:no-repeat;
	background-size:cover;
}
.bgcolor3 .wrapper {
	width: 82%;
	min-width:83%;
	background-color: rgba(255, 255, 255, 0.7);
	padding:4%;
}
main h2.h2menu {
	font-size: 1.5em;
	border-bottom:#4288bc 2px dotted;
	padding-bottom:1em;
	margin-bottom:1em;
}
/* #telset .tel {
	letter-spacing: -0.1px;
}*/


.tel a {
	text-decoration:none;
}
.telNoDeco a {
	text-decoration:none;
	color:#FFF;
}
.telNoDeco {
	color:#FFF;
}
#bg-vis .catch2 {
	text-indent: -9999px;
}
/* menu table*/


 table.table2-2 {
	width: 100%;
	margin-bottom:1em;
}
table.table2-2 tr {
	display: block;
}
table.table2-2 th {
	display: list-item;
	padding: 0;
	border-bottom: none;
	text-align: left;
	font-weight: normal;
	vertical-align: top;
	width: 100%;
	line-height: 1em;
	border:none;
	font-weight:bold;
}
table.table2-2 td {
	display: list-item;
	width: 100%;
	padding-bottom: 3%;
	margin-bottom: 3%;
	border-bottom: 1px #c9d4dc solid;
	font-weight: normal;
	padding: 5px 0 3% 0;
}
table td.add_bg {
	background-color:#e6ecf0
}
/* 地図複数の場合 */



#map_canvas2 {
	width:100%;
	height:380px;
	margin:0 auto;
	margin-bottom:20px;
}
#map_multi1 {
	width:100%;
	height:380px;
	margin:0 auto;
	margin-bottom:20px;
}
#map_multi2 {
	width:100%;
	height:380px;
	margin:0 auto;
	margin-bottom:20px;
}
/* 他 */

ul.liReseter {
	line-height:1.8em;
	margin-left:15px;
}
ul.liReseter li {
	display:list-item;
	list-style-type: disc;
	list-style-position: outside;
	padding-left:-10px;
}
ul.liReseter2 {
	line-height:1.8em;
	margin:0 0 12px 30px;
}
ul.liReseter2 li {
	display:list-item;
	list-style-type: disc;
	list-style-position: outside;
	padding-left:-10px;
}
ul.liReseterFloat {
	line-height:1.8em;
	margin-left:15px;
}
ul.liReseterFloat li {
	display:list-item;
	list-style-type: disc;
	list-style-position: outside;
	padding-left:-10px;
	float:left;
	padding-right:60px;
}
ol.liReseter {
	line-height:1.8em;
	margin-left:20px;
}
ol.liReseter li {
	display:list-item;
	list-style-type:decimal;
	list-style-position: outside;
	padding-left:-10px;
}
ol.liReseter2 {
	line-height:1.8em;
	margin:0 0 20px 50px;
}
ol.liReseter2 li {
	display:list-item;
	list-style-type:decimal;
	list-style-position: outside;
	padding-left:-10px;
}
ul.check {
	line-height:1.8em;
	margin-left:2px;
}
ul.check li {
	background-image:url(../img/common/check.png);
	background-repeat: no-repeat;
	background-position: left 6px;
	display:list-item;
	list-style-type: none;
	padding-left: 25px;
	padding-bottom: 5px;
	padding-top: 5px;
	margin-right: 5px;
	margin-left: 1px;
	padding-right: 5px;
}
.txt80 {
	font-size: 80%;
}
.a3-3 .pic {
	text-align: center;
}
.a3-4 .pic {
	text-align: center;
}
.a3-3 .pic img {
	width: 80%;
}
.a3-4 .pic img {
	width: 80%;
}
.portfolio {
	width: 48%;
	margin-right: 1%;
	margin-bottom: 2em;
	margin-left: 1%;
	float: left;
}
.portfolio .pic {
	text-align: center;
}
.portfolio .pic img {
	width: 85%;
}
/* 特別 */

.clear {
	clear:both;
}
div.clear {
	height:0px;
	line-height:0;
	font-size:0;
}
.ex2 {
	padding-left: 1em; /*1em（1文字）分、右に動かす*/
	text-indent: -1em; /*最初の行だけ1em（1文字）分、左に動かす*/
	margin-bottom:3em;
	line-height:1.3em;
}
.a3-3 .pic .highslide img {
	height: auto;
	width: 85%;
}
.a3-4 .pic .highslide img {
	height: auto;
	width: 85%;
}
.layout-a1 .a4-1 {
	width:68%;
	float:left;
	padding-right: 2%;
}
.layout-a1 .a4-2 {
	width:30%;
	float: right;
}
.layout-a1 .a4-1 .info {
	max-height:200px;
	min-height:80px;
	overflow:auto;
}
.layout-a1 .a4-1 .info dl {
	width:100%;
	overflow:auto;
}
.layout-a1 .a4-1 .info dl dt {
	float: left;
	clear:left;
	width: 5.0em;
	margin:0;
	padding: 3px 0 3px 4px;
}
.layout-a1 .a4-1 .info dl dd {
	margin:0;
	padding: 3px 0 3px 5.5em;
}
/* レイアウトA-3 (2カラム　1：1)*/

.layout-a3 .a3-3 {
	float:left;
	width:49%;
}
.layout-a3 .a3-4 {
	float:right;
	width:49%;
}
/* レイアウトA-3 (2カラム　1：1)*/

.a3-3 {
	float:left;
	width:49%;
}
.a3-4 {
	float:right;
	width:49%;
}
.a3-5 {
	float:left;
	width:49%;
}
.a3-6 {
	float:right;
	width:49%;
}
.a3-5 .pic {
	text-align: center;
}
.a3-6 .pic {
	text-align: center;
}
.list1 li:after {
	background:#13c51c;
	top:4px;
}
.philosophy {
	font-size: 2em;
	line-height: 1.5em;
}
.w85 {
	width: 85%;
	margin-right: auto;
	margin-left: auto;
}
.L30 {
	margin-left: 30px;
}
.cap {
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
}
.capL {
	text-align: left;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-right: 2em;
	padding-left: 2em;
}
ul.sns li {
	display: inline-block;
	vertical-align:top;
	margin-right: 5px;
}
ul li.facebook {
	line-height:0;
}
/* flow2 */
.flow dl dt {
	padding-top: 10px;
	padding-right: 1%;
	padding-bottom: 10px;
	padding-left: 1%;
	width: 16%;
	background-color: #5280CB;
	font-weight: bold;
	color: #FFF;
	text-align: center;
	float: left;
	border: 1px solid #5280CB;
	margin-bottom: 15px;
}
.flow dl dd {
	margin-bottom: 15px;
	width: 78%;
	padding-top: 10px;
	padding-right: 1%;
	padding-bottom: 10px;
	padding-left: 1%;
	float: left;
	border: 1px solid #5280CB;
}
.arrow {
	/*margin: 0 auto 0;
	width: 90px;  領域確保 */
	/*height: 70px;  領域確保 */
	position: relative;
}
.arrow:after {
	border-top: 10px solid #FFC300; /* 角度を緩やかなものに指定 */
	border-left: 15px solid transparent; /* 左のボーダーを透過に指定 */
	border-right: 15px solid transparent; /*右のボーダーを透過に指定*/
	content: "";
	position: absolute;
	top: 45px; /* 四角形の高さと同じ物を指定 */
	left: 50%; /* 中央寄せに使用 */
	margin-left: -15px; /* 中央寄せに使用 */
	-webkit-filter:drop-shadow(2px 2px 1px rgba(0, 0, 0, 0.3));
	filter:drop-shadow(2px 2px 1px rgba(0, 0, 0, 0.3));
}
.arrow:last-child:after {
	border: none; /* 最後のボックスだけ三角形を表示しない */
}
/* flow2 */
.flow_balloon {
	position: relative;
	padding: 0.75em;
	background-color: #dae7fd;
	border-radius: 2px;
	box-shadow: 2px 2px 4px rgba(164, 189, 232, .1) inset;
	margin-bottom: 18px;
	margin-right: 10px;
	margin-left: 10px;
}
.flow_balloon::after {
 position: absolute;
 top: 100%;
 left: 50%;
 content: '';
 width: 0;
 height: 0;
 border: 50px solid transparent;
 border-top: 15px solid #dae7fd;
 margin-left: -50px;
}
.flow_last {
	background-color: #acc4eb;
	box-shadow: 2px 2px 4px rgba(108, 142, 196, .1) inset;
	margin-bottom: 0px;
}
.flow_last::after {
 border: none;
 border-top: none;
}
.flow_balloon p {
	padding-right: 5px;
	padding-left: 10px;
}
.flow_balloon h3 {
	border-left-style: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
	margin-bottom: 0.5em;
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
	line-height: 1em;
	color: #093E97;
	font-size: 1.3em;
	text-align: left;
}
/* flow3 */
.flow_balloon2 {
	position: relative;
	padding: 0.75em;
	background-color: #ffffff;
	border-radius: 2px;
	box-shadow: 2px 2px 4px rgba(164, 232, 170, .1) inset;
	margin-bottom: 40px;
	margin-right: 10px;
	margin-left: 10px;
	border: 3px solid #090;
}
.flow_balloon2::after {
 position: absolute;
 bottom: -78px;
 left: 50%;
 content: '';
 width: 0;
 height: 0;
 border: 50px solid transparent;
 border-top: 15px solid #f9c569;
 margin-left: -50px;
}
.flow_last2 {
	background-color: #e0fae3;
	box-shadow: 2px 2px 4px rgba(167, 232, 164, .1) inset;
	margin-bottom: 0px;
}
.flow_last2::after {
 border: none;
 border-top: none;
}
.flow_balloon2 p {
	padding-right: 5px;
	padding-left: 10px;
}
.flow_balloon2 h3 {
	border-left-style: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
	margin-bottom: 0.5em;
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
	line-height: 1.3em;
	color: #0c9709;
	font-size: 1.3em;
	text-align: left;
}
/* flow4 */
.flow_balloon3 {
	position: relative;
	padding: 0.75em;
	background-color: #ffffff;
	border-radius: 2px;
	box-shadow: 2px 2px 4px rgba(164, 232, 170, .1) inset;
	margin-bottom: 20px;
	margin-right: 10px;
	margin-left: 10px;
	border: 3px solid #b0fbb0;
}
.flow_balloon3::after {
 position: absolute;
 bottom: -71px;
 left: 50%;
 content: '';
 width: 0;
 height: 0;
 border: 50px solid transparent;
 border-top: 15px solid #f9c569;
 margin-left: -50px;
}
.flow_last3 {
	background-color: #e0fae3;
	box-shadow: 2px 2px 4px rgba(167, 232, 164, .1) inset;
}
.flow_last3::after {
 border: none;
 border-top: none;
}
.flow_balloon3 p {
	padding-right: 5px;
	padding-left: 10px;
}
.flow_balloon3 h3 {
	border-left-style: none;
	border-bottom-style: none;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
	line-height: 1em;
	color: #0c9709;
	font-size: 1.3em;
	text-align: center;
	border-top-style: none;
	border-right-style: none;
	margin-bottom: 0px;
}
.ex_flow {
	padding-left: 1em;
	text-indent: -1em;
	display: block;
}
.catchcopy {
	font-weight:normal;
	font-size:1.2em;
	margin-bottom:0.6em;
	color:#090;
	letter-spacing: 1px;
}
/* テーブルを横スクロール */
table {
	width: 100%;
}
/*tableをスクロールさせる*/
/*tableのセル内にある文字の折り返しを禁止*/
.scroll {
	overflow: auto;
	white-space: nowrap;
}

/*tableにスクロールバーを追加*/
.scroll::-webkit-scrollbar {
 height: 5px;
}

/*tableにスクロールバーを追加*/
.scroll::-webkit-scrollbar-track {
 background: #F1F1F1;
}

/*tableにスクロールバーを追加*/
.scroll::-webkit-scrollbar-thumb {
 background: #BCBCBC;
}
.td_middle {
	vertical-align:middle;
}
 @media only screen and (max-width: 360px) {
 #map_canvas2 {
 width:300px;
 height:300px;
}
.layout-a1 .a4-1 .info dl {
 margin: 0 0 1.5em 0;
}
.layout-a1 .a4-1 .info dl dt {
 float: none;
 clear:both;
}
.layout-a1 .a4-1 .info dl dd {
 margin:0;
 padding: 3px 0 3px 0;
}



/* table調整 */


.add1 {
 height:150px;
}
 .add1 td {
 vertical-align:middle;
}
 .add1 th {
 width:30%;
}
 th.add3 {
 text-align:left;
}
 .add1 th.add3 {
 width:60%;
}


/* リスト追加 */


.admit {
 border:2px #c9d4dc solid;
 padding:30px;
}
 .admit li {
 float:left;
 width:25%;
 line-height:2.5em
}
 .admit li span {
 width:80px;
 display:block;
 float:left;
}
}
 @media screen and (max-width: 768px) {
 .admit li {
 float:left;
 width:auto;
 line-height:2.5em;
 min-width:180px;
}
 .admit li span {
 width:auto;
 margin-right:1em;
 display:block;
 float:left;
}
 #footer .inq-set .txt {
 color:#FFF;
 font-size:1.1em;
 padding:5px 1% 0 0;
 margin-bottom:15px;
}
 .layout-a1 .a4-1 {
 width:100%;
 float:none;
 padding:2em 0 0;
}
 .layout-a1 .a4-1 .info {
 margin: 0 0 1.5em 0;
 width:100%;
 overflow:visible;
 height:auto;
 max-height:none;
}
.layout-a1 .a4-1 .info dl {
 overflow:visible;
}
 .layout-a1 .a4-2 {
 width:100%;
 margin-right: auto;
 margin-left: auto;
 float: none;
 text-align:center;
}
.layout-a3 .a3-3 {
 float:left;
 width:49%;
 margin-bottom:1em;
}
.layout-a3 .a3-4 {
 float:right;
 width:49%;
 margin-bottom:1em;
}
 .portfolio {
 width:100%;
 margin-right: auto;
 margin-left: auto;
 float: none;
 text-align:center;
}
.L30 {
 margin-left: none;
}
}
/* ////// arra-ez responsive set --- please custom as you like //////////////////////////  */
 
.shell {
	display: flex;
	flex-direction:row;
	flex-wrap:wrap;
}
.shell.reverse {
	display: flex;
	flex-direction:row-reverse;
	flex-wrap:wrap;
}
.shell.nowrap-x {
	flex-wrap:nowrap;
}
.shell.left {
	justify-content:flex-start;
}
.shell.center, .shell.x-center {
	justify-content:center;
}
.shell.right {
	justify-content:flex-end;
}
.shell.fill, .shell.fill-x, .shell.split {
	justify-content:space-between;
}
.shell.equalize {
	justify-content:space-around;
}
.shell.top {
	align-items:flex-start;
}
.shell.middle, .shell.y-center {
	align-items:center;
}
.shell.baseline {
	align-items:baseline;
}
.shell.bottom {
	align-items:flex-end;
}
.shell > .grow-x {
	flex-grow:1;
}
.stretch, .grow-y {
	align-self:stretch;
}
.solo, .full {
	width:100%;
}
.duo, .half {
	width:50%;
}
.trio, .one-third {
	width:calc(100% / 3);
}
.two-thirds {
width:calc(100% / 3 * 2);
}
.quad, .quarter {
	width:25%;
}
.three-quarters {
	width:75%;
}
.penta, .twenty {
	width:20%;
}
.thirty {
	width:30%;
}
.forty {
	width:40%;
}
.sixty {
	width:60%;
}
.seventy {
	width:70%;
}
.eighty {
	width:80%;
}
.solo.gutter, .full.gutter {
	width:98%;
	margin:1em 1%;
}
.duo.gutter, .half.gutter {
	width:48%;
	margin:1em 1%;
}
.trio.gutter, .one-third.gutter {
	width:calc(94% / 3);
	margin:1em 1%;
}
.two-thirds.gutter {
width:calc(97% / 3 * 2);
	margin:1em 1%;
}
.quad.gutter, .quarter.gutter {
	width:23%;
	margin:1em 1%;
}
.three-quarters.gutter {
	width:73%;
	margin:1em 1%;
}
.penta.gutter, .twenty.gutter {
	width:18%;
	margin:1em 1%;
}
.thirty.gutter {
	width:28%;
	margin:1em 1%;
}
.forty.gutter {
	width:38%;
	margin:1em 1%;
}
.sixty.gutter {
	width:58%;
	margin:1em 1%;
}
.seventy.gutter {
	width:68%;
	margin:1em 1%;
}
.eighty.gutter {
	width:78%;
	margin:1em 1%;
}
.centering {
	text-align:center;
}
.centering > * {
	margin-left:auto !important;
	margin-right:auto !important;
}
/* Universal Padding Class --- as you like */
.pd-around {
	padding:1.5em 1.5em;
}
.pd-side {
	padding:0 1.5em;
}
.pd-top-bottom {
	padding:1.5em 0;
}
.pd-right {
	padding-right:1.5em;
}
.pd-left {
	padding-left:1.5em;
}
/* clearfix --- for use together with legacy float layout */
.clearfix:before, .clearfix:after {
	content: " ";
	display: table;
}
.clearfix:after {
	clear: both;
}
.clearfix {
*zoom: 1;
}
.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}
 
/*** Media Query ***/
@media only screen and (max-width: 899px) {
 .shell.break900:not(.step) {
flex-direction:column;
}
 .shell.break900 > .solo, .shell.break900 > .full, .shell.break900 > .duo, .shell.break900 > .half, .shell.break900 > .trio, .shell.break900 > .one-third, .shell.break900 > .two-thirds, .shell.break900 > .quad, .shell.break900 > .quarter, .shell.break900 > .three-quarters, .shell.break900 > .penta, .shell.break900 > .twenty, .shell.break900 > .thirty, .shell.break900 > .forty, .shell.break900 > .sixty, .shell.break900 > .seventy, .shell.break900 > .eighty {
width:100%;
}
 .shell.break900 > .solo.gutter, .shell.break900 > .full.gutter, .shell.break900 > .duo.gutter, .shell.break900 > .half.gutter, .shell.break900 > .trio.gutter, .shell.break900 > .one-third.gutter, .shell.break900 > .two-thirds.gutter, .shell.break900 > .quad.gutter, .shell.break900 > .quarter.gutter, .shell.break900 > .three-quarters.gutter, .shell.break900 > .penta.gutter, .shell.break900 > .twenty.gutter, .shell.break900 > .thirty.gutter, .shell.break900 > .forty.gutter, .shell.break900 > .sixty.gutter, .shell.break900 > .seventy.gutter, .shell.break900 > .eighty.gutter {
width:98%;
margin:1em 1%;
}



 .shell.step {
flex-direction:row;
flex-wrap:wrap;
}
 .shell.step > .duo, .shell.step > .half, .shell.step > .trio, .shell.step > .one-third, .shell.step > .two-thirds, .shell.step > .quad, .shell.step > .quarter, .shell.step > .three-quarters, .shell.step > .penta, .shell.step > .twenty, .shell.step > .thirty, .shell.step > .forty, .shell.step > .sixty, .shell.step > .seventy, .shell.step > .eighty {
width:50%;
}
 .shell.step > .duo.gutter, .shell.step > .half.gutter, .shell.step > .trio.gutter, .shell.step > .one-third.gutter, .shell.step > .two-thirds.gutter, .shell.step > .quad.gutter, .shell.step > .quarter.gutter, .shell.step > .three-quarters.gutter, .shell.step > .penta.gutter, .shell.step > .twenty.gutter, .shell.step > .thirty.gutter, .shell.step > .forty.gutter, .shell.step > .sixty.gutter, .shell.step > .seventy.gutter, .shell.step > .eighty.gutter {
width:48%;
margin:1em 1%;
}
}
 
/* Mobile Single Column ( like 7-10 inch Tablet ) */
@media only screen and (max-width: 768px) {
 .container, .wide-container {
padding:0 0.3em;
} /* as you like */
 .shell.break768:not(.step) {
flex-direction:column;
}
 .shell.break768 > .solo, .shell.break768 > .full, .shell.break768 > .duo, .shell.break768 > .half, .shell.break768 > .trio, .shell.break768 > .one-third, .shell.break768 > .two-thirds, .shell.break768 > .quad, .shell.break768 > .quarter, .shell.break768 > .three-quarters, .shell.break768 > .penta, .shell.break768 > .twenty, .shell.break768 > .thirty, .shell.break768 > .forty, .shell.break768 > .sixty, .shell.break768 > .seventy, .shell.break768 > .eighty {
width:100%;
}
 .shell.break768 > .solo.gutter, .shell.break768 > .full.gutter, .shell.break768 > .duo.gutter, .shell.break768 > .half.gutter, .shell.break768 > .trio.gutter, .shell.break768 > .one-third.gutter, .shell.break768 > .two-thirds.gutter, .shell.break768 > .quad.gutter, .shell.break768 > .quarter.gutter, .shell.break768 > .three-quarters.gutter, .shell.break768 > .penta.gutter, .shell.break768 > .twenty.gutter, .shell.break768 > .thirty.gutter, .shell.break768 > .forty.gutter, .shell.break768 > .sixty.gutter, .shell.break768 > .seventy.gutter, .shell.break768 > .eighty.gutter {
width:98%;
margin:1em 1%;
}
 .shell:not(.keep) > .solo, .shell:not(.keep) > .full, .shell:not(.keep) > .duo, .shell:not(.keep) > .half, .shell:not(.keep) > .trio, .shell:not(.keep) > .one-third, .shell:not(.keep) > .two-thirds, .shell:not(.keep) > .quad, .shell:not(.keep) > .quarter, .shell:not(.keep) > .three-quarters, .shell:not(.keep) > .penta, .shell:not(.keep) > .twenty, .shell:not(.keep) > .thirty, .shell:not(.keep) > .forty, .shell:not(.keep) > .sixty, .shell:not(.keep) > .seventy, .shell:not(.keep) > .eighty {
width:100%;
margin:0;
}
 .shell:not(.keep) > .solo.gutter, .shell:not(.keep) > .full.gutter, .shell:not(.keep) > .duo.gutter, .shell:not(.keep) > .half.gutter, .shell:not(.keep) > .trio.gutter, .shell:not(.keep) > .one-third.gutter, .shell:not(.keep) > .two-thirds.gutter, .shell:not(.keep) > .quad.gutter, .shell:not(.keep) > .quarter.gutter, .shell:not(.keep) > .three-quarters.gutter, .shell:not(.keep) > .penta.gutter, .shell:not(.keep) > .twenty.gutter, .shell:not(.keep) > .thirty.gutter, .shell:not(.keep) > .forty.gutter, .shell:not(.keep) > .sixty.gutter, .shell:not(.keep) > .seventy.gutter, .shell:not(.keep) > .eighty.gutter {
width:98%;
margin:1em 1%;
}
 .shell.step {
flex-direction:row;
flex-wrap:wrap;
}
 .shell.step > .duo, .shell.step > .half, .shell.step > .trio, .shell.step > .one-third, .shell.step > .two-thirds, .shell.step > .quad, .shell.step > .quarter, .shell.step > .three-quarters, .shell.step > .penta, .shell.step > .twenty, .shell.step > .thirty, .shell.step > .forty, .shell.step > .sixty, .shell.step > .seventy, .shell.step > .eighty {
width:50%;
}
 .shell.step > .duo.gutter, .shell.step > .half.gutter, .shell.step > .trio.gutter, .shell.step > .one-third.gutter, .shell.step > .two-thirds.gutter, .shell.step > .quad.gutter, .shell.step > .quarter.gutter, .shell.step > .three-quarters.gutter, .shell.step > .penta.gutter, .shell.step > .twenty.gutter, .shell.step > .thirty.gutter, .shell.step > .forty.gutter, .shell.step > .sixty.gutter, .shell.step > .seventy.gutter, .shell.step > .eighty.gutter {
width:48%;
margin:1em 1%;
}
 .shell.keep-half:not(.keep), .shell.keep-half:not(.keep) {
flex-direction:row;
}
 .shell.keep-half:not(.keep) > .solo, .shell.keep-half:not(.keep) > .full, .shell.keep-half:not(.keep) > .duo, .shell.keep-half:not(.keep) > .half, .shell.keep-half:not(.keep) > .trio, .shell.keep-half:not(.keep) > .one-third, .shell.keep-half:not(.keep) > .two-thirds, .shell.keep-half:not(.keep) > .quad, .shell.keep-half:not(.keep) > .quarter, .shell.keep-half:not(.keep) > .three-quarters, .shell.keep-half:not(.keep) > .penta, .shell.keep-half:not(.keep) > .twenty, .shell.keep-half:not(.keep) > .thirty, .shell.keep-half:not(.keep) > .forty, .shell.keep-half:not(.keep) > .sixty, .shell.keep-half:not(.keep) > .seventy, .shell.keep-half:not(.keep) > .eighty {
width:50%;
}
 .shell.keep-half:not(.keep) > .solo.gutter, .shell.keep-half:not(.keep) > .full.gutter, .shell.keep-half:not(.keep) > .duo.gutter, .shell.keep-half:not(.keep) > .half.gutter, .shell.keep-half:not(.keep) > .trio.gutter, .shell.keep-half:not(.keep) > .one-third.gutter, .shell.keep-half:not(.keep) > .two-thirds.gutter, .shell.keep-half:not(.keep) > .quad.gutter, .shell.keep-half:not(.keep) > .quarter.gutter, .shell.keep-half:not(.keep) > .three-quarters.gutter, .shell.keep-half:not(.keep) > .penta.gutter, .shell.keep-half:not(.keep) > .twenty.gutter, .shell.keep-half:not(.keep) > .thirty.gutter, .shell.keep-half:not(.keep) > .forty.gutter, .shell.keep-half:not(.keep) > .sixty.gutter, .shell.keep-half:not(.keep) > .seventy.gutter, .shell.keep-half:not(.keep) > .eighty.gutter {
width:48%;
margin:1em 1%;
}
     
    /* Universal padding class --- as you like */
    .pd-around {
padding:1.5em 1.5em;
}
 .pd-side {
padding:0 1.5em;
}
 .ttal {
text-align:left !important;
}
 .ttal:not(.pd-side) {
padding:0 1.5em;
}
 .pd-around .ttal:not(.pd-side), .pd-side .ttal:not(.pd-side) {
padding:0;
}
}
 
/* Traditional SmartPhone Portrait Size */
@media only screen and (max-width: 479px) {
 .shell:not(.keep), .shell.step:not(.keep) {
flex-direction:column;
}
 .shell.step:not(.keep) > .solo, .shell.step:not(.keep) > .full, .shell.step:not(.keep) > .duo, .shell.step:not(.keep) > .half, .shell.step:not(.keep) > .trio, .shell.step:not(.keep) > .one-third, .shell.step:not(.keep) > .two-thirds, .shell.step:not(.keep) > .quad, .shell.step:not(.keep) > .quarter, .shell.step:not(.keep) > .three-quarters, .shell.step:not(.keep) > .penta, .shell.step:not(.keep) > .twenty, .shell.step:not(.keep) > .thirty, .shell.step:not(.keep) > .forty, .shell.step:not(.keep) > .sixty, .shell.step:not(.keep) > .seventy, .shell.step:not(.keep) > .eighty {
width:100%;
margin: margin:0;
}
 .shell.step:not(.keep) > .solo.gutter, .shell.step:not(.keep) > .full.gutter, .shell.step:not(.keep) > .duo.gutter, .shell.step:not(.keep) > .half.gutter, .shell.step:not(.keep) > .trio.gutter, .shell.step:not(.keep) > .one-third.gutter, .shell.step:not(.keep) > .two-thirds.gutter, .shell.step:not(.keep) > .quad.gutter, .shell.step:not(.keep) > .quarter.gutter, .shell.step:not(.keep) > .three-quarters.gutter, .shell.step:not(.keep) > .penta.gutter, .shell.step:not(.keep) > .twenty.gutter, .shell.step:not(.keep) > .thirty.gutter, .shell.step:not(.keep) > .forty.gutter, .shell.step:not(.keep) > .sixty.gutter, .shell.step:not(.keep) > .seventy.gutter, .shell.step:not(.keep) > .eighty.gutter {
width:98%;
margin:1em 1%;
}
 
    /* Single Column --- Universal margin-bottom class */
    .shell.automa >, .shell.automa > .gutter {
margin-bottom:1.5em !important;
}
 
    /* Universal padding class --- as you like */
    .pd-around {
padding:6% 3%;
}
 .pd-side, .pd-right, .pd-left {
padding:0 3%;
}
 .stal {
text-align:left !important;
}
 .stal:not(.pd-side) {
padding:0 3%;
}
 .pd-around .stal:not(.pd-side), .pd-side .stal:not(.pd-side) {
padding:0;
}
}
.defaultlist li {
	list-style-type:none !important;
	list-style-image:none !important;
	margin: 5px 0px 5px 0px !important;
}
.list1 li {
	position:relative;
	padding-left:20px;
}
.list1 li:before {
	content:'';
	display:block;
	position:absolute;
	box-shadow: 0 0 2px 2px rgba(255, 255, 255, 0.2) inset;
	top:3px;
	left:2px;
	height:0;
	width:0;
	border-top: 6px solid transparent;
	border-right: 7px solid transparent;
	border-bottom: 6px solid transparent;
	border-left: 9px solid #08b047;
}
.list2 li {
	position:relative;
	padding-left:20px;
}
.list2 li:before {
	content:'';
	height:0;
	width:0;
	display:block;
	border:5px transparent solid;
	border-right-width:0;
	border-left-color:#08b047;
	position:absolute;
	top:5px;
	left:8px;
}
.list2 li:after {
	content:'';
	height:2px;
	width:10px;
	display:block;
	background:#08b047;
	position:absolute;
	top:9px;
	left:0px;
}
.list3 li {
	position:relative;
	padding-left:20px;
}
.list3-maru:after {
	content:'';
	display:block;
	position:absolute;
	top:3px;
	left:3px;
	border-radius:30px;
	height:7px;
	width:7px;
	border:3px solid #08b047;
}
.list3-batu:before, .list3-batu:after {
	content:'';
	display:block;
	position:absolute;
	top:8px;
	left:3px;
	height:4px;
	width:14px;
	background:#08b047;
	transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
}
.list3-batu:after {
	transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-o-transform:rotate(45deg);
}
.list4 li {
	position:relative;
	padding-left:20px;
}
.list4 li:after, .list4 li:before {
	content:'';
	display:block;
	position:absolute;
	top:4px;
	left:8px;
	height:11px;
	width:4px;
	background:#08b047;
	border-radius:10px;
	transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-o-transform:rotate(45deg);
}
.list4 li:before {
	top:8px;
	left:3px;
	height:8px;
	transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
}
.list5 li {
	position: relative;
	padding-left: 20px;
}
.list5 li:before {
	content:'';
	height:0px;
	width: 90%;
	display:block;
	position:absolute;
	top:23px;
	left:0px;
	border-bottom: 1px dashed #aaa;
}
.list5 li:after {
	content:'';
	display:block;
	position:absolute;
	background:#08b047;
	width:5px;
	height:5px;
	top:7px;
	left:5px;
	border-radius: 5px;
}
.list6 li {
	position:relative;
	padding-left:20px;
}
.list6 li:after {
	content:'';
	display:block;
	position:absolute;
	background:#08b047;
	width:9px;
	height:9px;
	top:5px;
	left:5px;
	transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
}
.list7 li {
	position:relative;
	display: block;
	padding: 5px 0px 5px 30px;
	background: #1cba58;
	color: #fff;
	border-radius:15px 0px 0px 15px;
}
.list7 li:after {
	content:'';
	display:block;
	position:absolute;
	width:14px;
	height: 14px;
	top:7px;
	left:5px;
	background: #fff;
	border-radius: 10px;
}
.list8 {
	counter-reset:li;
	margin-left:20px !important;
}
.list8 li {
	position:relative;
	display: block;
	padding:8px 0px 8px 40px;
}
li.list8-count:after {
	counter-increment: li;
	content: counter(li);
	position: absolute;
	left: -16px;
	top: 2px;
	background: #a4d1b5;
	height: 30px;
	width: 30px;
	line-height: 32px;
	border: 2px solid #1cba58;
	color: #fff;
	text-align: center;
	font-weight: bold;
	border-radius: 30px;
}
li.list8-count:before {
	content:'';
	display:block;
	position:absolute;
	box-shadow: 0 0 2px 2px rgba(255, 255, 255, 0.2) inset;
	top:11px;
	left:15px;
	height:0;
	width:0;
	border-top: 8px solid transparent;
	border-right: 7px solid transparent;
	border-bottom: 8px solid transparent;
	border-left: 13px solid #1cba58;
}
.list9 {
	counter-reset:li;
}
.list9 li {
	position: relative;
	display: block;
	padding: 5px 0px 5px 50px;
	background: #a4d1b5;
	border: 2px solid #1cba58;
	border-radius: 2px;
	/* [disabled]margin-left:-15px !important;
*/
}
li.list9-count:after {
	counter-increment: li;
	content: counter(li);
	position: absolute;
	left: 0px;
	top: 0px;
	background: #1cba58;
	height: 30px;
	width: 30px;
	line-height: 30px;
	border: 2px solid #1cba58;
	color: #fff;
	text-align: center;
	font-weight: bold;
	/* [disabled]border-radius: 2px;
*/
}
li.list9-count:before {
	content:'';
	display:block;
	position:absolute;
	box-shadow: 0 0 2px 2px rgba(255, 255, 255, 0.2) inset;
	top:8px;
	left:33px;
	height:0;
	width:0;
	border-top: 8px solid transparent;
	border-right: 7px solid transparent;
	border-bottom: 8px solid transparent;
	border-left: 13px solid #1cba58;
}
.list10 {
	counter-reset:li;
}
.list10 li {
	position:relative;
	display: block;
	padding:10px 0px 10px 30px;
	margin-left:0px !important;
}
li.list10-count:after {
	counter-increment: li;
	content: counter(li) ".";
	position: absolute;
	display: block;
	text-align: center;
	font-style: italic;
	left: 0px;
	top: 6px;
	font-size: 30px;
	color:#96bc9d;
	font-family:'Goudy Bookletter 1911', Georgia, serif;
}
.sssp {
	display:block;
}
@media screen and (max-width: 768px) {
 .sssp {
 display:none;
}
}
.bgcolor2 .mail, .bgcolor1 .mail, .bgcolor3 .mail, {
	margin:5px;	
}
 
.bgcolor2 .mail a, .bgcolor1 .mail a, .bgcolor3 .mail a {
	background-color: #090;
	padding:5px 10px 5px 35px;
	margin-bottom:5px;
	margin-top:5px;
	background-image:url(../img/common/footer_icn_mail.png);
	background-position:10px 9px;
	background-repeat:no-repeat;
	color:#FFF;
	text-decoration:none;
	border-radius: 2px;
	-webkit-border-radius: 2px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 2px;   /* Firefox用 */
}
dl.qa dt{
	padding-left: 42px;
	background-image: url(../img/common/icn_q.png);
	padding-top: 5px;
	padding-bottom: 10px;
	background-repeat: no-repeat;
	background-position: left 1px;
	line-height: 1.5em;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
	clear: both;

}
dl.qa dd{
	padding-left: 42px;
	padding-top: 10px;
	background-image: url(../img/common/icn_a.png);
	background-repeat: no-repeat;
	background-position: left 5px;
	margin-bottom: 20px;
}

.shell{
	max-width:100%;
}
.mb5{
	margin-bottom:10px;
}