/*

Editor	: C.I.
Version	: 1.0
Since	: 2019-12-25

 */

/* ----------------------------------------------------------
 /index.html
------------------------------------------------------------ */
.home header{
position:fixed;
z-index: 100;
top:0;
left:0;
right:0;
border:none;
}
.home header .logo span,
.home header a{
color:#fff;
}
@media only screen and (max-width: 1024px){
    .home header nav #Gnav li a{color:#222;}
}
.home header #Gnav li.current-menu-item a:after{
border-color:#fff;
}
.home header nav #hdSubNav .navSubTel a:before{
background:url("/asset/img_cmn/icon_phone_f.png") 0 0 no-repeat;
background-size:auto 98%;
margin-right: 5px;
}
.home header nav #hdSubNav p.navSubContact a{
color:#222;
}
.home header.FixHd a{
color:#222;
}
.home header.FixHd nav #hdSubNav .navSubTel a:before{
background:url("/asset/img_cmn/icon_phone.png") 0 0 no-repeat;
background-size:auto 98%;
}
#indexTopTtlWrap{
position: relative;
/*overflow: hidden;*/
}
#indexTopTtlWrap figure{
margin-top:0;
width:100%;
}
.home .aboutIndex{
text-align:center;
}
.home .aboutIndex h2{
text-align: center;
background:none;
}
.logoMark {
text-align: right;
width:70%;
}
.logoMark img{
height:4em;
width:auto;
display: inline-block;
}
.topStory01 .inTxt,
.topStory02 .inTxt,
.topStory03 .inTxt{
width:50%;
}
@media only screen and (max-width: 767px){
	.topStory01 .inTxt,
	.topStory02 .inTxt,
	.topStory03 .inTxt{
	width:90%;
	}
}
.topStory01 .inTxt{
margin-left: 20%;
}
@media only screen and (max-width: 767px){
	.topStory01 .inTxt{
	margin-left: 1em;
	}
}
.topStory03 .inTxt{
margin-left: 50%;
}
.topStory01 .inTxt:before,
.topStory02 .inTxt:before,
.topStory03 .inTxt:before{
content:"";
display: block;
width:10em;
height:6em;
margin-left:-5em;
}
@media only screen and (max-width: 767px){
	.topStory01 .inTxt:before,
	.topStory02 .inTxt:before,
	.topStory03 .inTxt:before{
	margin-left:-1em;
	}
	.topStory03 .inTxt{
	margin-left: 1em;
	}
}
.topStory03 .inTxt:before,
.topStory01 .inTxt:before{
background:url("/asset/img_cmn/txt_story_f.svg") no-repeat 0 0;
background-size: 100% auto;
}
.topStory02 .inTxt:before{
background:url("/asset/img_cmn/txt_story.svg") no-repeat 0 0;
background-size: 100% auto;
}
.topStory01{
padding-top:5em;
color:#fff;
background:url("/asset/img/top_story_bg.jpg") no-repeat 100% 0;
}
.topStory02{
padding-top:5em;
background:url("/asset/img/top_story_2.jpg") no-repeat 0 0;
}
.topStory03{
padding-top:5em;
color:#fff;
background:url("/asset/img/top_story_3.jpg") no-repeat 100% 0;
}
@media only screen and (max-width: 767px){
	.topStory03,
	.topStory02,
	.topStory01{
		padding-top:2em;
	}
	.topStory02{
	background-position: 50% 0 !important;
	text-shadow: 5px 5px 5px #fff;
	}
	.topStory03{
	background-position: 20% 0 !important;
	text-shadow: 5px 5px 5px #000;
	}
}
.newsW .columG4 h2{
background:none;
}
.newsW .columG4 h2 span{
display: block;
font-size:70%;
width:4.5em;
text-align: center;
font-weight: bold;
color:#00D5AF;
}
.newsW .linkToIndex a{
display: inline-block;
background:url("/asset/img_cmn/bg_backtocontact.svg") 100% 100% no-repeat;
padding:0 1em 0.5em 0;
text-decoration: none;
font-weight: bold;
font-size:90%;
}
.newsW .columG4 .inTxt{
border-right:solid 1px #222;
margin-right: 2em;
}
@media only screen and (max-width: 767px){
	.newsW .columG4 .inTxt{
	border-right:none;
	margin-right: 0;
	}
	.newsW .columG4 .inTxt h2{
	float:left;
	}
	.newsW .columG4 .inTxt p.linkToIndex{
	float:right;
	}
	.newsW .columG4 .inTxt:after{
	content:"";
	display: block;
	height:0;
	visibility: hidden;
	clear: both;
	}
}
.newsW .newsLists li{
border-bottom:none;
}
.newsW .inCon{
position:relative;
}
.newsW .inCon:after{
content:"";
display: inline-block;
position:absolute;
width:20em;
height:5em;
background:url("/asset/img/txt_news.svg") 0 0 no-repeat;
background-size:auto 100%;
bottom:-2em;
right:0;
}

/* topBnr */
.topBnr{
text-align: center;
}
.topBnr li,
.topBnr li a{
display: inline-block;
text-decoration: none;
color:#fff;
font-weight: bold;
vertical-align: middle;
font-size:1.2em;
}
.topBnr li a img{
height:1.3em;
width:auto;
display: inline-block;
margin-right: 5px;
vertical-align: baseline;
}
.topBnr li{
min-width:300px;
min-height: 4.5em;
background:url("/asset/img/top_blog_bg.jpg") 100% 100% no-repeat;
}
.topBnr li a{
padding:1em;
}
.topBnr li a{
display: inline-block;
padding:1em 5em;
background:url("/asset/img_cmn/icon_arrow_f.svg") 95% 50% no-repeat;
background-size: auto 0.3em;
}
@media only screen and (max-width: 1024px){

.topBnr li{margin-top:0.5em;margin-left:0;margin-right: 0;}
.topBnr li a{display: block;padding:1em;}
}
.topContactW{
margin-top:4em;
color:#fff;
background:url("/asset/img/top_contact_bg.jpg") 100% 100% no-repeat;
}
.topContactW h2{
background:none;
text-align: center;
}
.topContactW h2 span{
display: block;
font-size:80%;
color:#00D5AF;
}
.topContactW .contactTel a{
text-decoration: none;
font-size:200%;
font-weight: bold;
border-bottom:solid 1px #fff;
padding-bottom:0.5em;
}
.topContactW .contactTel a:before{
content:"";
display: inline-block;
background:url("/asset/img_cmn/icon_phone_f.png") 0 50%  no-repeat;
background-size:  100% auto;
width:1em;
height:1em;
vertical-align: middle;
margin-right: 0.5em;
}
.topContactW .feeTel{
text-align: left;
font-weight: bold;
font-size:120%;
}
.topContactW .feeTel span{font-size:16px;font-weight: normal}
.topContactW .feeTel span,
.topContactW a{
color:#fff;
}
.topContactW .feeTel a:before{
content:"";
display: inline-block;
background:url("/asset/img_cmn/icon_freed.svg") 0 50%  no-repeat;
background-size:  100% auto;
width:1em;
height:1em;
vertical-align: middle;
margin-right: 0.5em;
}
.topContactW .feeTel a{
display: block;
font-size:1.5em;
text-decoration: none;
}
.topContactW .inBg{
position:relative;
padding:4em;
width:60%;
margin-right: auto;
margin-left: auto;
}
@media only screen and (max-width: 767px){
	.topContactW .inBg{
	position:relative;
	padding:1em;
	width:auto;
	margin-right: 1em;
	margin-left: 1em;
	}
}

.topContactW .inBg:after{
content:"";
display: block;
position:absolute;
width:100%;
height:100%;
left:0;
right:0;
top:0;
bottom:0;
background-color:#000;
z-index:0;
opacity: 0.5; filter: alpha(opacity=50);
}
.topContactW h2,
.topContactW .columG2{
position:relative;
z-index:1;
}
.topContactW h2{margin-top:0;}

.topContactW .linkBtn li a{
background-image:none;
}
.topContactW .linkBtn li a:before{
content:"";
display: inline-block;
width: 1.3em;
height:1em;
background:url("/asset/img_cmn/icon_email.png") 0 0 no-repeat;
background-size: auto 100% ;
vertical-align: middle;
margin-left:0.3em;
}
.topContactW .backToContact li a{
color:#fff;
text-align: center;
background:url("/asset/img_cmn/bg_backtocontact_f.svg") 100% 100% no-repeat
}
.topContactW .contactform{
text-align: center;
}
.topContactW .contactform a{
text-align: center;
padding-left:1em;
padding-right: 1em;
}
.topContactW .inCon{
position:relative;
}
.topContactW .inCon:after{
content:"";
display: inline-block;
position:absolute;
width:18em;
height:8em;
background:url("/asset/img/txt_contact.svg") 0 0 no-repeat;
background-size:auto 100%;
top:0;
left:10%;
}
@media only screen and (max-width: 767px){
    #TopCareers .inTxt{
    float:none;
    width:80%;
    margin-left:auto;
    margin-right: auto;
    }
}

/* ----------------------------------------------------------
 /about/
------------------------------------------------------------ */
.conceptW{
background:url("/asset/img/concept_pic.jpg") 0 0 no-repeat;
background-size:100% auto;
}

.conceptW .columG2{
position:relative;
}
.conceptW .columG2:before{
content:"";
display: inline-block;
position:absolute;
width:20em;
height:8em;
background:url("/asset/img/txt_concept.svg") 0 0 no-repeat;
background-size:auto 100%;
bottom:0;
right:-3em;
z-index:3;
}
@media only screen and (max-width: 767px){
	.conceptW .columG2:before{
	right:1em;
	width:15em;
	}
}

/* h2 */
.shopownerW h2,
.handmade h2,
.conceptW h2{
background:none;
text-align: center;
}
.shopownerW h2,
.conceptW h2{color:#fff;}
.shopownerW h2:after,
.handmade h2:after,
.conceptW h2:after{
content:"";
display:block;
width:2em;
height:1px;
border-top:solid 3px #00D5AF;
margin-left: auto;
margin-right: auto;
}

/* concept */
.conceptW dl.col{
position:relative;
color:#fff;
margin-left: -10em;
padding-left: 10em;
padding-top:8em;
padding-bottom:16em;
z-index:0;
}
.conceptW dl.col dt,
.conceptW dl.col dd{
padding-left:6em;
padding-right: 4em;
position:relative;
z-index:1;
}
@media only screen and (max-width: 1300px){
.conceptW dl.col{
padding-bottom:3em;
padding-bottom:4em;
}
.conceptW .columG2 + .tumList3{
margin-top:6em !important;
}
}
@media only screen and (max-width: 767px){
	.conceptW dl.col{
	position:relative;
	color:#fff;
	margin-left: 0;
	padding-left: 0;
	margin-top:-5em;
	padding-bottom:8em;
	}
	.conceptW dl.col dt,
	.conceptW dl.col dd{
	padding-left:1em;
	padding-right: 1em;
	}
	.conceptW .columG2 + .tumList3{
	margin-top:1em !important;
	}
}
.conceptW dl.col:after{
content:"";
display: block;
position:absolute;
z-index:0;
height:100%;
width:100%;
top:0;
bottom:0;
right:0;
left:0;
background-color:#000;
opacity: 0.5; filter: alpha(opacity=50);
}
.conceptW figure.col{
margin-top:5em;
}
.conceptW figure.col img{
margin-right: -10em;
position:relative;
z-index:1;
}
.conceptW .columG2 + .tumList3{
margin-top:10em;
}
.conceptW .tumList3 li figure{
padding:0 0.5em;
display: block;
}
.conceptW .iconLists{
margin-top:5em;
}
@media only screen and (max-width: 767px){
	.conceptW figure.col img{
	margin-right: 0;
	}
	.conceptW .tumList3 li figure{
	padding:0;
	}
	.conceptW .columG2 + .tumList3{
	margin-top:2em;
	}
	.conceptW .columG2{margin-top:-2em;}
}

/* handmade */
.handmade h2{
text-align:center;
}
.handmade h2:before{
content:"";
height:1em;
width:2em;
background:url("/asset/img_cmn/icon_bicycle.svg") 50% 50% no-repeat;
background-size:auto 100%;
display: block;
margin-left:auto;
margin-right: auto;
}
.handmade .lead{
text-align: center;
}
.handmade .columG2{
background-color:#F7F9F9;
}
.handmade .columG2 .col{
margin-left:0 !important;
width:50%;
}
.handmade .columG2 figure.col{
margin-top:0;
}
.handmade .columG2 div.col .inTxt{
width:50%;
padding:4em;
}
.handmade .inCon + .columG2 div.col .inTxt{
padding-right: 0;
}
.handmade .columG2 + .columG2 div.col .inTxt{
float:right;
padding-left: 0;
}
.handmade .columG2 + .columG2 .col:after{
content:"";
display: block;
height:0px;
clear:both;
visibility: hidden;
}
@media only screen and (max-width: 767px){
	.handmade .columG2 .col{
	width:auto;
	}
	.handmade .columG2 div.col .inTxt{
	width:auto;
	padding:1em;
	}
}
.handmade .tumList3{
margin-top:4em;
}
.handmade .tumList3 li{
width:33.3%;
margin-left:0;
}
.handmade .tumList3 li img{
margin-bottom:0;
}
@media only screen and (max-width: 767px){
	.handmade .tumList3 li{
	width:100%;
	margin-left:0;
	}
	.handmade .columG2 + .columG2 div.col .inTxt{
	padding:1em;
	float:none;
	}
}

/* handmadeOutline */
.handmade .handmadeOutline{
background-color:#fff;
border:solid 2px #222;
width:80%;
margin:2em auto 0;
padding:2em 0 4em;
}

.handmade .handmadeOutline h3{
text-align: center;
}
.handmade .handmadeOutline h3:before{
content:"";
height:2em;
width:2.5em;
background:url("/asset/img_cmn/icon_handmade.svg") 50% 50% no-repeat;
background-size:auto 100%;
display: block;
margin-left:auto;
margin-right: auto;
}

.handmade .handmadeOutline table{
width:80%;
margin-left:auto;
margin-right: auto;
}
@media only screen and (max-width: 767px){
	.handmade .handmadeOutline{
	background-color:#fff;
	border:solid 2px #222;
	width:auto;
	margin:1em 0;
	padding:1em ;
	}
	.handmade .handmadeOutline .tableS th{
	width:30%;
	}
	.handmade .handmadeOutline table{
	width:auto;
	}
}
.handmade .applyHandmade{
text-align: center;
margin-top:2em;
margin-bottom:2em;
}
.handmade .applyHandmade dt{
font-size:14px;
}
.handmade .applyHandmade dd{
font-size:2em;
line-height: 1.1;
font-weight: 700;
display: inline-block;
padding-bottom:5px;
border-bottom:solid 3px #222;
}
.handmade .applyHandmade dd:before{
content:"";
display: inline-block;
width: 1em;
height:1em;
background:url("/asset/img_cmn/icon_phone.png") 0 0 no-repeat;
background-size: auto 90% ;
vertical-align: middle;
margin-left:0.3em;
}
.handmade .applyHandmade dd a{
text-decoration: none;
}
.shopownerW h2{
text-align: center;
}
.shopownerW{
background:url("/asset/img/about_shop_bg.jpg") 0 0 no-repeat;
background-size:  100% auto;
}

.shopownerW .col2{
position:relative;
margin-left:-10em;
padding-left:12em;
}
.shopownerW .col2:after{
content:"";
display: block;
position:absolute;
z-index:0;
height:100%;
width:100%;
top:0;
bottom:0;
right:0;
left:0;
background-color:#000;
opacity: 0.5; filter: alpha(opacity=50);
}
.shopownerW .col2 .inTxt{
position:relative;
z-index:1;
padding:2em;
color:#fff;
}
.shopownerW figure.col1{
position:relative;
z-index:1;
margin-top:4.5em;
}
.shopownerW figure.col1:before{
content:"";
position:absolute;
height:3em;
width:6em;
background:url("/asset/img/about_text_boss.svg") 0 0 no-repeat;
background-size:auto 100%;
top:-2.3em;
left:-1.5em;
}
@media only screen and (max-width: 767px){
	.shopownerW figure.col1:before{
	top:-3em;
	left:0.5em;
	}
	.shopownerW .col2{
	position:relative;
	margin-left:0;
	padding-left:0;
	
	}
	.shopownerW .col2 .inTxt{margin-top:1em;}
	.shopownerW .inCon{
	padding-bottom:0;
	}
	
}
.shopInfoW .inCon{
position:relative;
}
.shopInfoW .inCon:after{
content:"";
display: inline-block;
position:absolute;
width:20em;
height:5em;
background:url("/asset/img/txt_shopinfo.svg") 0 0 no-repeat;
background-size:auto 100%;
bottom:1em;
right:1em;
}
.shopInfoW h2{
text-align: center;
background:none;
}
@media only screen and (max-width: 767px){
.shopInfoW .inCon > h2:first-child{
margin-top:0;
}
}
.shopInfoW h2 span{
display: block;
font-size:14px;
color:#00D5AF;
font-weight: bold;
}
.shopInfoW h3 span{
display: block;
font-size:14px;
}
.shopInfoW h3{
background:url("/asset/img_cmn/ttl_bg.svg") 0 90% no-repeat;
background-size:auto 0.5em;
}
.shopInfoW .shopinfomationD dt,
.shopInfoW .shopinfomationD dd{
display: inline-block;
}
.shopInfoW .shopinfomationD dt{
padding-right:10px;
}
.shopInfoW .shopinfomationD dt:after{
content:"/";
color:#00D5AF;
margin-left:10px;
}
.shopInfoW .shopinfomationD dd.full{
display: block;
}
.shopInfoW .makerIcon{
background-color:#fff;
padding:2em;
width:80%;
}
.shopInfoW .inCon{
padding-bottom:5em;
}
.shopInfoW div.col .map{
margin-top:2em;
}
.shopInfoW .columG2{
position:relative;
}
.shopInfoW .columG2:before{
content:"";
position:absolute;
width:100%;
height:115%;
right:30%;
top:-10%;
bottom:-30%;
background-color:#F5F8F8;
z-index: -1;
}
@media only screen and (max-width: 767px){
.shopInfoW .columG2:before{
right:5%;
}
}
/* ----------------------------------------------------------
 /service/
------------------------------------------------------------ */
.ServiceW{
background:url("/asset/img/maintenace_main_bg.jpg") 0 0 no-repeat;
}

.ServiceW .columG2{
position:relative;
}
.ServiceW .columG2:before{
content:"";
display: inline-block;
position:absolute;
width:20em;
height:8em;
background:url("/asset/img/txt_maintenance.svg") 0 0 no-repeat;
background-size:auto 100%;
bottom:0;
right:-3em;
z-index:3;
}

.ServiceW div.col{
position:relative;
color:#fff;
margin-right: -10em;
padding-right: 10em;
}

@media only screen and (max-width: 1250px){
.ServiceW .columG2:before{
right:0;
}
}
@media only screen and (max-width: 767px){
.ServiceW div.col{

margin-right: 0;
padding-right: 0;
}
}
.ServiceW div.col:after{
content:"";
display: block;
position:absolute;
z-index:0;
height:100%;
width:100%;
top:0;
bottom:0;
right:0;
left:0;
background-color:#000;
opacity: 0.5; filter: alpha(opacity=50);
}
.ServiceW .inTxt{
position:relative;
z-index:1;
padding:2em;
}
.ServiceW figure.col{
margin-top:2em;
}
.ServiceW figure.col img{
margin-right: -10em;
position:relative;
z-index:1;
}
.ServiceW .inTxt .atd{
background:linear-gradient(to right,#0BA687,#1C1C1C);
padding:10px 1.5em;
}

.ServiceW .inTxt .lists{
border:solid 2px #fff;
padding:1em 1.5em;
}
.ServiceW .inTxt .pointTxt{
color:#00D5AF;
padding-left:1.8em;
background:url("/asset/img_cmn/icon_point.svg") 0 0.3em no-repeat;
background-size:auto 1.5em;
}


.selfW div.columG3 .col2 h3:before{
content:"";
display: inline-block;
width:4.5em;
height:2em;
margin-right: 10px;
vertical-align: middle;
}
.selfW div.columG3:nth-child(2) .col2 h3:before{
background:url("/asset/img_cmn/txt_step1.svg") 0 0 no-repeat;
background-size: 100% auto;
}
.selfW div.columG3:nth-child(3) .col2 h3:before{
background:url("/asset/img_cmn/txt_step2.svg") 0 0 no-repeat;
background-size: 100% auto;
}
.selfW div.columG3:nth-child(4) .col2 h3:before{
background:url("/asset/img_cmn/txt_step3.svg") 0 0 no-repeat;
background-size: 100% auto;
}
.ProW .tumList2 li figure{
padding:0.5em;
}
.ProW .tumList2 li figcaption strong{
display: block;
font-size:1.3em;
padding:6px 0 6px 5px;
}

.ProW .tumList2 li figcaption strong:before{
content:"";
display: inline-block;
width:4em;
height:1.6em;
margin-right: 10px;
vertical-align: middle;
}
.ProW .tumList2 li:nth-child(1) figcaption strong:before{
background:url("/asset/img_cmn/txt_point_1.svg") 0 0 no-repeat;
background-size: 100% auto;
}
.ProW .tumList2 li:nth-child(2) figcaption strong:before{
background:url("/asset/img_cmn/txt_point_2.svg") 0 0 no-repeat;
background-size: 100% auto;
}
.ProW .tumList2 li:nth-child(3) figcaption strong:before{
background:url("/asset/img_cmn/txt_point_3.svg") 0 0 no-repeat;
background-size: 100% auto;
}
.ProW .tumList2 li:nth-child(4) figcaption strong:before{
background:url("/asset/img_cmn/txt_point_4.svg") 0 0 no-repeat;
background-size: 100% auto;
}
@media only screen and (max-width: 767px){
	.ProW h2{margin-top:0;}
}

/* ----------------------------------------------------------
 /items/
------------------------------------------------------------ */
.itemsW h2{
margin-top:3em;
}

/* ----------------------------------------------------------
 /blog/
------------------------------------------------------------ */
.blogList{margin-top:0;}
.blogList li{margin-top:2em;}
.blogList li a{display: block;position: relative;padding-bottom:2em;border-bottom: solid 2px #222;margin:0 1em;}
.blogList li a time,
.blogList li a span.linkBtn{display: block;position: absolute;bottom:0;font-weight: bold;}
.blogList li a time{
left:0;
}
.blogList li a span.linkBtn{
right:0;
padding-right:1.5em;
background:url("/asset/img_cmn/icon_arrow.svg") 100% 50% no-repeat;
background-size:auto 0.3em;
}
@media only screen and (max-width: 767px){
#TopCareers .inTxt{
float:none;
width:80%;
margin-left:auto;
margin-right: auto;
}
.blogList li a{margin:0 0;}
.blogList li a time,
.blogList li a span.linkBtn{font-size:80%;}
}
@media only screen and (max-width: 372px){
    .blogList li a time{position: static;}
}

/* ----------------------------------------------------------
 /contact/
------------------------------------------------------------ */
.ContactTelW{
text-align: center;
border-top:solid 5px #222;
border-bottom:solid 5px #222;
padding-bottom:2em;
}
.ContactTelW .contactPhone{
font-size:300%;
font-weight: bold;
line-height: 1.2;
}
@media only screen and (max-width: 767px){
	 .ContactTelW .contactPhone{
	font-size:200%;
	}
}
.ContactTelW .contactPhone a{
text-decoration: none;
}
.ContactTelW .contactPhone a:before{
content:"";
display: inline-block;
width: 1.5em;
height:1em;
background:url("/asset/img_cmn/icon_email2.png") 0 0 no-repeat;
background-size: auto 100% ;
vertical-align: middle;
margin-left:0.3em;
}


/* ----------------------------------------------------------
 /privacy/
------------------------------------------------------------ */
.backToContact{
margin-top:4em;
text-align:center;
}
.backToContact li a{
display: inline-block;
background:url("../img_cmn/bg_backtocontact.svg") 100% 100% no-repeat;
padding:0 2em 0.5em;
text-decoration: none;
}
.privacyW h2{background:none;}
.privacyW h2:after{
content:none;
}

.privacyW section:first-child h2{
margin-top:1em;
}