@charset "UTF-8";


#wrap {  }

#header { background: url("../../img/headerBgM.png") repeat-x 0 0; background-size: cover; width: 100%; color: #fff; position: relative; height: 55px;  }

#header .header h1 a { background: url("../../img/logoM.png") no-repeat center 50%; background-size: 90px; width: 100%; display: inline-block; text-indent: -9999em; overflow: hidden;  text-align: center; height: 55px; }


@media all and (min-width: 768px) {

	#header { background: url("../../img/headerBg.png") repeat-x 0 0; height: 72px; width: 100%; color: #fff; position: relative;  }
	#header a { color: #fff; }
	#header .header { max-width: 1000px; margin: 0 auto; position: relative; z-index: 1000;}

	#header .header h1 a { width: 113px; height: 44px; display: block; text-indent: -9999em; overflow: hidden; background: url("../../img/logo.png") no-repeat 20px 0; float: left; margin-top: 15px; padding-left: 20px; }
}


#header .header .lang { position: absolute; top: 0; right: 0; z-index: 1000; }
#header .header .lang ul { display: none; position: absolute; top: 55px; right: 0; background: rgba(49, 49, 49, 0.9); padding: 15px 15px 0 15px; }
#header .header .lang li a { display: inline-block; width: 48px; text-indent: -9999em; margin: 0 0 5px 0; }

#header .header .lang p a { display: block; overflow: hidden; text-indent: -9999em; }

#header .header .lang p .ko { background: url("../../img/koM_c.png") no-repeat right 0; background-size: 100%; width: 55px; height: 55px;}
#header .header .lang li .ko { background: url("../../img/koM.png") no-repeat right 0; background-size: 100%; width: 103px; height: 26px;}

#header .header .lang p .en { background: url("../../img/enM_c.png") no-repeat right 0; background-size: 100%; width: 55px; height: 55px; }
#header .header .lang li .en { background: url("../../img/enM.png") no-repeat right 0; background-size: 100%; width: 103px; height: 26px; }

#header .header .lang p .jp { background: url("../../img/jpM_c.png") no-repeat right 0; background-size: 100%; width: 55px; height: 55px; }
#header .header .lang li .jp { background: url("../../img/jpM.png") no-repeat right 0; background-size: 100%; width: 103px; height: 26px; }

#header .header .lang p .cn { background: url("../../img/cnM_c.png") no-repeat right 0; background-size: 100%; width: 55px; height: 55px; }
#header .header .lang li .cn { background: url("../../img/cnM.png") no-repeat right 0; background-size: 100%; width: 103px; height: 26px; }

#header .header .lang p .id { background: url("../../img/idM_c.png") no-repeat right 0; background-size: 100%; width: 55px; height: 55px; }
#header .header .lang li .id { background: url("../../img/idM.png") no-repeat right 0; background-size: 100%; width: 103px; height: 26px; }

@media all and (min-width: 768px) {
	#header .header .lang { position: absolute; top: 5px; right: 5px; width: 92px; padding: 0 5px;  }
	#header .header .lang ul { display: none; position: static; width: auto; background: none; padding: 0; }
	#header .header .lang li a,
	#header .header .lang p a { width: 76px; height: 14px; display: block; overflow: hidden; text-indent: -9999em; margin: 8px 0; }
	#header .header .lang p .ko,
	#header .header .lang li .ko	{ background: url("../../img/ko.png") no-repeat right 0; width: 76px; height: auto; }

	#header .header .lang p .en,
	#header .header .lang li .en { background: url("../../img/en.png") no-repeat right 0; width: 76px; height: auto; }

	#header .header .lang p .jp,
	#header .header .lang li .jp { background: url("../../img/jp.png") no-repeat right 0; width: 76px; height: auto; }

	#header .header .lang p .cn,
	#header .header .lang li .cn { background: url("../../img/cn.png") no-repeat right 0; width: 76px; height: auto; }
	
	#header .header .lang p .id,
	#header .header .lang li .id { background: url("../../img/id.png") no-repeat right 0; width: 76px; height: auto; }

	#header .header .lang p.here { display: block; background: url("../../img/lang_here.png") no-repeat 82px 2px; }
	#header .header .lang.color { background: rgba(49, 49, 49, 0.5); }

}





#header .header .mNaviBtn { position: absolute; top: 0; left: 0; display: block; background: url("../../img/topNaviM.png") no-repeat 0 0; background-size: 100%; border: none; width: 55px; height: 55px; overflow: hidden; text-indent: -9999em; cursor: pointer;  }
#header .header .topNavi { display: none; }

#header .header .topNaviM { display: none; position: absolute; top: 55px; left: 0; z-index: 1000; width: 50%; }
#header .header .topNaviM > li { display: block; font-weight: bold; vertical-align: top;  }
#header .header .topNaviM a { display: block; color: #fff; }
#header .header .topNaviM > li > a { background-color: #303030; border-bottom: #6f6f6f 1px solid; padding: 10px 20px; }

#header .header .topNaviM > li.here > a { color: #FFB400; }

#header .header .topNaviM > li > a span { background: url("../../img/naviM_icon.png") no-repeat right bottom; padding-right: 20px; background-size: 12px; }
#header .header .topNaviM > li > a span.top { background: url("../../img/naviM_icon_on.png") no-repeat right bottom; padding-right: 20px; background-size: 12px; }

#header .header .topNaviM > li a:hover,
#header .header .topNaviM > li a:focus { color: #FFB400; }

#header .header .topNaviM > li ul { display: none; border-bottom: #6f6f6f 1px solid; }
#header .header .topNaviM > li li {  }
#header .header .topNaviM > li li a { background-color: #232323; border-bottom: #393939 1px solid; padding: 10px 30px; 
}
#header .header .topNaviM > li li.on a { color: #FFB400; }


@media all and (min-width: 768px) {
	#header .header .mNaviBtn { display: none; }
	#header .header .topNaviM { display: none; }

	#header .header .topNavi { display: block; float: right; padding-right: 75px; }
	#header .header .topNavi > li { display: inline-block; height: 72px; font-weight: bold; vertical-align: top;  }
	#header .header .topNavi > li > a { padding: 0 25px; display: block; text-align: center; height: 72px; line-height: 92px; }

	#header .header .topNavi > li.here > a,
	#header .header .topNavi > li:hover > a,
	#header .header .topNavi > li:focus > a { background: url("../../img/headerBg_on.png") repeat-x 0 0; }

	#header .header .topNavi > li ul { display: none; padding: 10px 0 0 0; }
	#header .header .topNavi > li li { text-align: center; line-height: 1.9;  }
	#header .header .topNavi > li li a { color: #D6D6D6; display: block; font-size: .9em; }
	#header .header .topNavi > li li a:hover,
	#header .header .topNavi > li li a:focus,
	#header .header .topNavi > li li.on a { color: #FFB400; }

	#header .topNavi_sub { display: none; width: 100%; height: 100px; position: absolute; top: 72px; left: 0; background-color: rgba(48, 48, 48, .69); z-index: 100; }
}






/* Webkit */
#footer ::-webkit-input-placeholder { color: #666666; }
​/* Firefox 4-18 */
#footer :-moz-placeholder { color: #000; }
​/* Firefox 19+ */
#footer ::-moz-placeholder { color: #000; }
​/* IE10+ */
#footer :-ms-input-placeholder { color: red; }


#footer { background-color: #474747; clear: both; }

#footer .footer { max-width: 1000px; margin: 0 auto; overflow: hidden; padding: 0 0 30px 0; position: relative; }
#footer .footer .pageTop { background: url("../../img/page_up.png") no-repeat center 50%; background-size: cover; position: absolute; top: 20px; right: 20px; width: 43px; height: 43px; border-radius: 25px; overflow: hidden; text-indent: -9999em; z-index: 1000; }


@media all and (min-width:768px) {
	#footer .footer { max-width: 700px; margin: 0 auto; overflow: hidden; padding: 50px 50px 30px; }
	#footer .footer .pageTop { width: 34px; height: 34px; top: 20px; right: 50px; }
}
@media all and (min-width:1025px) {
	#footer .footer { max-width: 700px; margin: 0 auto; overflow: hidden; padding: 50px 150px 30px 150px; }
	#footer .footer .pageTop { width: 34px; height: 34px; top: 20px; right: 150px; }
}





#footer .footer .left { width: 94%; padding: 0 3%; position: relative; }

#footer .footer .left .digi  { padding: 30px 0  25px 0;  }
#footer .footer .left .digi span { display: inline-block; overflow: hidden; padding-right: 10px; vertical-align: middle; }

#footer .footer .left .digi span img { width: 100%;  }

#footer .footer .left .digi strong { display: block; padding-top: 15px; }
#footer .footer .left .digi a { display: inline-block; color: #d5d5d5; border: #adadad 2px solid; padding: 0 8px; height: 25px; line-height: 25px; text-align: center; vertical-align: middle; font-size: .9em; } 

#footer .footer .left address { color: #d5d5d5; line-height: 1.6; font-size: .8em; } 

@media all and (min-width:768px) {
	#footer .footer .left { width: 55%; padding: 0; float: left; text-align: left; background: none; }

	
	#footer .footer .left .digi span.digiwork { max-width: 92px; }
	#footer .footer .left .digi span.alleview { max-width: 65px; }
	#footer .footer .left .digi span img { width: 100%;  }
	
	#footer .footer .left .digi strong { display: inline; padding-top: 0; }
	#footer .footer .left .digi a { display: inline-block; color: #d5d5d5; border: #adadad 2px solid; padding: 0 8px; height: 25px; line-height: 25px; text-align: center; vertical-align: middle; } 
	
	#footer .footer .left address { color: #d5d5d5; padding-bottom: 20px; line-height: 1.6; font-size: .8em; } 
	#footer .footer .left .sns { padding-bottom: 20px; text-align: left; }
	
	#footer .footer .left .skill { padding-bottom: 0; }
	#footer .footer .left .skill a { display: inline-block; color: #d5d5d5; border: #adadad 2px solid; padding: 0 8px; height: 25px; line-height: 25px; text-align: center; }

}




#footer .footer .right { padding: 0 3%; margin: 0 auto;  }
#footer .footer .right .rightBox { }

#footer .footer .right .rightBox > p { float: left; padding: 33px 0  25px 0;  }
#footer .footer .right .rightBox > p a { display: inline-block; color: #d5d5d5; border: #adadad 2px solid; padding: 0 15px; height: 25px; line-height: 25px; text-align: center; }	

#footer .footer .right .sns { float: right; padding: 36px 0  25px 0; }
#footer .footer .right .sns li { display: inline-block; }
#footer .footer .right .sns li a { display: block; overflow: hidden; width: 24px; height: 24px; text-indent: -9999em; }
#footer .footer .right .sns li a.fb { background: url("../../img/fb_icon.png") no-repeat 0 0; }
#footer .footer .right .sns li a.tw { background: url("../../img/tw_icon.png") no-repeat 0 0; }
#footer .footer .right .sns li a.ins { background: url("../../img/ins_icon.png") no-repeat 0 0; }

#footer .footer .right .skill { clear: both; color: #d5d5d5; }
#footer .footer .right .skill > p { padding-bottom: 10px; font-size: 1.1em; font-weight: bold;  }
#footer .footer .right .skill ul { position: relative; overflow: hidden; }
#footer .footer .right .skill li { width: 32%; }
#footer .footer .right .skill li:nth-child(1) { position: absolute; top: 0; left: 0; }
#footer .footer .right .skill li:nth-child(2) { margin: 0 auto; }
#footer .footer .right .skill li:nth-child(3) { position: absolute; top: 0; right: 0; }
#footer .footer .right .skill a { display: block; color: #d5d5d5; border: #adadad 2px solid; padding: 0 8px; height: 25px; line-height: 25px; text-align: center; }

@media all and (min-width:768px) {
	#footer .footer .right { width: 45%; padding: 0; float: right; }

	#footer .footer .right .skill > p { padding-bottom: 10px; font-size: 1.1em; font-weight: bold; text-align: left; }
	#footer .footer .right .skill ul { position: relative; overflow: hidden; width: 100%; }
}





#footer #copyright { background: url("../../img/copyrightBg.png") repeat-x 0 0; height: 63px; line-height: 63px; }
#footer #copyright .copyright { max-width: 700px; margin: 0 auto; color: #d5d5d5; font-size: .8em; text-align: center; }


@media all and (min-width:768px) {
	#footer #copyright .copyright { text-align: left; }
}

@media all and (min-width:1025px) {
	#footer #copyright .copyright { max-width: 700px; margin: 0 auto; color: #d5d5d5; font-size: .8em; padding: 0 150px; }
}