@charset "utf-8";

/* ======================================================
 * layout.css
 * ------------------------------------------------------
 * WIRE FRAME *******************************************
 * Common
 * Body
 * Header
 * Navigation
 * Contents
 * Footer
 * MEDIA ************************************************
 * Responsive
 * Clearfix
====================================================== */

/********************************************************

  WIRE FRAME

********************************************************/

/* Common
------------------------------------------------------ */
/* hover */
#navigation .megaMenu > .menuContent .menuList01 a:hover,
#navigation .megaMenu > .menuClose > a:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
	zoom: 1;
}

/* transition */
#navigation .megaMenu > .menuContent .menuList01 a,
#navigation .megaMenu > .menuClose > a {
	-webkit-transition: opacity 0.2s ease-out 0s;
	   -moz-transition: opacity 0.2s ease-out 0s;
	    -ms-transition: opacity 0.2s ease-out 0s;
	        transition: opacity 0.2s ease-out 0s;
}
#navigation .commonMenu > li > a:after,
#navigation .megaMenu > .menuContent .menuList03 > li > a:after,
.footerWrap02 #pageTopBtn > a {
	-webkit-transition: all 0.2s ease-out 0s;
	   -moz-transition: all 0.2s ease-out 0s;
	    -ms-transition: all 0.2s ease-out 0s;
	        transition: all 0.2s ease-out 0s;
}

/* overlay */
.menuOverlay {
	position: fixed;
	left: 0;
	top: 0;
	display: none;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.5);
	z-index: 99;
}


/* Body
------------------------------------------------------ */
#pageContainer {
}


/* Header
------------------------------------------------------ */
#globalHeader {
	position: absolute;
	left: 0;
	top: 0;
	clear: both;
	width: 100%;
	height: 80px;
	border-top: 3px solid #e60012;
	background-color: #fff;
	z-index: 100;
}
#header {
	clear: both;
}

/*----- headerWrap01 -----*/
.headerWrap01 {
	width: 1000px;
	margin: 0 auto;
}
.headerWrap01 .hdrIdentity {
	float: left;
}
.headerWrap01 .hdrIdentity .siteLogo {
	padding: 17px 0 0 0;
}
.headerWrap01 .hdrIdentity .siteLogo img {
	max-width: 242px;
	height: auto;
}
.headerWrap01 .hdrUtility {
	float: right;
	padding: 16px 0 0 0;
}
.headerWrap01 .hdrUtility .ecBtn {
	float: right;
	margin: 0 0 0 17px;
}
.headerWrap01 .hdrUtility .ecBtn img {
	max-width: 223px;
	height: auto;
}
.headerWrap01 .hdrUtility .contactBtn {
	float: right;
	margin: 0 0 0 24px;
	padding: 10px 0 0 0;
}
.headerWrap01 .hdrUtility .contactBtn > a {
	display: inline-block;
	padding: 5px 12px 3px 45px;
	border: 1px solid #bbbbbb;
	border-radius: 14px;
	background-color: #fff;
	background-image: url(/common-files/img/cmn_mail_ic01.png);
	background-repeat: no-repeat;
	background-position: 14px 50%;
	color: #666666;
	font-size: 13px;
	font-size: 1.3rem;
	text-decoration: none !important;
}
.headerWrap01 .hdrUtility .contactBtn > a:hover {
	background-color: #dddddd;
}
.headerWrap01 .hdrUtility .utilMenu {
	float: right;
	margin: 0 0 0 24px;
	padding: 10px 0 0 0;
}
.headerWrap01 .hdrUtility .utilMenu > li {
	float: left;
	line-height: 30px;
}
.headerWrap01 .hdrUtility .utilMenu > li + li {
	margin-left: 24px;
}
.headerWrap01 .hdrUtility .utilMenu > li > a {
	color: #666666;
	font-size: 12px;
	font-size: 1.2rem;
}
.headerWrap01 .hdrUtility .utilMenu > li > a:hover {
	color: #888888;
}
.headerWrap01 .hdrUtility .menuBtn {
	display: none;
}
.headerWrap01 .hdrUtility .spMenu {
	display: none;
}


/* Navigation
------------------------------------------------------ */
#globalNavi {
	clear: both;
	position: absolute;
	left: 0;
	top: 80px;
	width: 100%;
	height: 70px;
	border-bottom: 1px solid #edecec;
	background-color: #fff;
	z-index: 100;
}

/*----- navigation -----*/
#navigation {
	width: 1000px;
	margin: 0 auto;
}
#navigation .commonMenu {
	float: left;
	width: 792px;
}
#navigation .commonMenu > li {
	float: left;
	width: 168px;
}
#navigation .commonMenu > li + li {
	margin-left: 40px;
}
#navigation .commonMenu > li > a {
	position: relative;
	display: table;
	width: 100%;
	border-bottom: 2px solid #dddddd;
	color: #333333;
	font-size: 17px;
	font-size: 1.7rem;
	font-weight: bold;
	line-height: 1.25;
	text-decoration: none !important;
	z-index: 1000;
}
#navigation .commonMenu > li > a:after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 0;
	height: 2px;
	background-color: #dddddd;
}
.chrome #navigation .commonMenu > li > a:after {
	bottom: -2px;
}
#navigation .commonMenu > li > a > span {
	display: table-cell;
	width: 100%;
	height: 48px;
	padding: 5px 0 3px;
	text-align: center;
	vertical-align: middle;
}
#navigation .commonMenu > li:not(.on) > a:hover:after {
	width: 100%;
	background-color: #e60012;
}
#navigation .commonMenu > li.on > a {
	border-bottom-color: #e60012;
}
#navigation .commonMenu > li.on > a:after {
	width: 100%;
	background-color: #e60012;
}
#navigation .commonMenu > li.is-active > a {
	color: #e60012;
}
#navigation .commonMenu > li.is-active > a:after {
	bottom: -2px;
	width: 100%;
	height: 4px;
	background-color: #e60012;
}
.chrome #navigation .commonMenu > li.is-active > a:after {
	bottom: -4px;
}
#navigation .megaMenu {
	position: absolute;
	left: 0;
	top: 48px;
	display: none;
	width: 100%;
	padding: 45px 0;
	border-top: 1px solid #dddddd;
	background-color: #f6f6f6;
	z-index: 999;
}
#navigation .megaMenu > *:first-child {
	margin-top: 0 !important;
}
#navigation .megaMenu > .menuHeading {
	width: 1000px;
	margin: 0 auto;
}
#navigation .megaMenu > .menuHeading > *:first-child {
	margin-top: 0 !important;
}
#navigation .megaMenu > .menuHeading > .hdg {
}
#navigation .megaMenu > .menuHeading > .hdg > a {
	display: inline-block;
	padding: 0 0 0 23px;
	background: url(/common-files/img/cmn_link_ic09.png) no-repeat 0 0.4em;
	color: #333333;
	font-size: 28px;
	font-size: 2.8rem;
	font-weight: bold;
	text-decoration: none !important;
}
#navigation .megaMenu > .menuHeading > .hdg > a:hover {
	color: #555555;
}
#navigation .megaMenu > .menuContent {
	clear: both;
	width: 1000px;
	margin: 20px auto 0;
}
#navigation .megaMenu > .menuContent > *:first-child {
	margin-top: 0 !important;
}
#navigation .megaMenu > .menuContent .menuLayout01 {
	clear: both;
	margin: 20px 0 0 0;
}
#navigation .megaMenu > .menuContent .menuLayout01 > .colMain {
	float: left;
	width: 742px;
}
#navigation .megaMenu > .menuContent .menuLayout01 > .colSub {
	float: right;
	width: 218px;
}
#navigation .megaMenu > .menuContent .menuLayout01 > [class^="col"] > *:first-child {
	margin-top: 0 !important;
}
#navigation .megaMenu > .menuContent .menuList01 {
	margin: 25px 0 0 0;
}
#navigation .megaMenu > .menuContent .menuList01 > li {
}
#navigation .megaMenu > .menuContent .menuList01 > li + li {
	margin-top: 15px;
}
#navigation .megaMenu > .menuContent .menuList01 a {
	position: relative;
	display: block;
	padding: 12px 20px 10px 40px;
	border-radius: 4px;
	background-color: #ff7c84;
	background-image: -webkit-linear-gradient(-45deg, #ff767f 25%, #ff7c84 25%, #ff7c84 50%, #ff767f 50%, #ff767f 75%, #ff7c84 75%, #ff7c84);
	background-image:    -moz-linear-gradient(-45deg, #ff767f 25%, #ff7c84 25%, #ff7c84 50%, #ff767f 50%, #ff767f 75%, #ff7c84 75%, #ff7c84);
	background-image:     -ms-linear-gradient(-45deg, #ff767f 25%, #ff7c84 25%, #ff7c84 50%, #ff767f 50%, #ff767f 75%, #ff7c84 75%, #ff7c84);
	background-image:      -o-linear-gradient(-45deg, #ff767f 25%, #ff7c84 25%, #ff7c84 50%, #ff767f 50%, #ff767f 75%, #ff7c84 75%, #ff7c84);
	background-image:         linear-gradient(-45deg, #ff767f 25%, #ff7c84 25%, #ff7c84 50%, #ff767f 50%, #ff767f 75%, #ff7c84 75%, #ff7c84);
	background-size: 15px 15px;
	-webkit-box-shadow: 1px 1px 0px 0px rgba(0,0,0,0.25);
	   -moz-box-shadow: 1px 1px 0px 0px rgba(0,0,0,0.25);
	    -ms-box-shadow: 1px 1px 0px 0px rgba(0,0,0,0.25);
	     -o-box-shadow: 1px 1px 0px 0px rgba(0,0,0,0.25);
	        box-shadow: 1px 1px 0px 0px rgba(0,0,0,0.25);
	color: #fff;
	font-size: 19px;
	font-size: 1.9rem;
	font-weight: bold;
	line-height: 1.25;
	text-decoration: none !important;
}
#navigation .megaMenu > .menuContent .menuList01 a:before {
	content: "";
	position: absolute;
	left: 20px;
	top: 50%;
	display: inline-block;
	width: 10px;
	height: 14px;
	margin: -7px 0 0 0;
	background: url(/common-files/img/cmn_link_ic07.png) no-repeat 0 0;
}
#navigation .megaMenu > .menuContent .menuList02 {
	margin: 25px 0 0 0;
}
#navigation .megaMenu > .menuContent .menuList02 > dt {
	margin: 0 0 20px 0;
	padding: 0 0 10px 0;
	border-bottom: 1px solid #cccccc;
	color: #de4f5a;
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1.25;
}
#navigation .megaMenu > .menuContent .menuList02 > dd {
}
#navigation .megaMenu > .menuContent .menuList02 > dd > *:first-child {
	margin-top: 0 !important;
}
#navigation .megaMenu > .menuContent .menuList03 {
	margin: 25px 0 0 0;
}
#navigation .megaMenu > .menuContent .menuList03 > li {
	float: left;
	margin: 0 0 0 3.2%;
}
#navigation .megaMenu > .menuContent .menuList03.count3 > li { width: 31.2%; }
#navigation .megaMenu > .menuContent .menuList03.count4 > li { width: 22.6%; }
#navigation .megaMenu > .menuContent .menuList03.count3 > li:nth-child(3n+1),
#navigation .megaMenu > .menuContent .menuList03.count4 > li:nth-child(4n+1) {
	clear: left;
	margin-left: 0;
}
#navigation .megaMenu > .menuContent .menuList03.count3 > li:nth-child(n+4),
#navigation .megaMenu > .menuContent .menuList03.count4 > li:nth-child(n+5) {
	margin-top: 25px;
}
#navigation .megaMenu > .menuContent .menuList03 > li > a {
	position: relative;
	display: block;
	padding: 0 0 10px 18px;
	border-bottom: 1px solid #cccccc;
	background: url(/common-files/img/cmn_link_ic02.png) no-repeat 0 0.2em;
	color: #de4f5a;
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1.25;
	text-decoration: none !important;
}
#navigation .megaMenu > .menuContent .menuList03 > li > a:after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	display: inline-block;
	width: 0;
	height: 1px;
	background-color: #cccccc;
}
#navigation .megaMenu > .menuContent .menuList03 > li > a:hover:after {
	width: 100%;
	background-color: #de4f5a;
}
#navigation .megaMenu > .menuContent .menuList04 {
	margin: 25px 0 0 0;
}
#navigation .megaMenu > .menuContent .menuList04 > li {
	float: left;
	margin: 0 0 0 3.2%;
}
#navigation .megaMenu > .menuContent .menuList04.count3 > li { width: 31.2%; }
#navigation .megaMenu > .menuContent .menuList04.count4 > li { width: 22.6%; }
#navigation .megaMenu > .menuContent .menuList04.count3 > li:nth-child(3n+1),
#navigation .megaMenu > .menuContent .menuList04.count4 > li:nth-child(4n+1) {
	clear: left;
	margin-left: 0;
}
#navigation .megaMenu > .menuContent .menuList04.count3 > li:nth-child(n+4),
#navigation .megaMenu > .menuContent .menuList04.count4 > li:nth-child(n+5) {
	margin-top: 0.5em;
}
#navigation .megaMenu > .menuContent .menuList04 > li > a {
	display: inline-block;
	padding: 0 0 0 14px;
	background: url(/common-files/img/cmn_link_ic03.png) no-repeat 0 0.4em;
	color: #666666;
	font-size: 15px;
	font-size: 1.5rem;
}
#navigation .megaMenu > .menuContent .menuList04 > li > a:hover {
	color: #888888;
}
#navigation .megaMenu > .menuContent .menuLayout01 > .colSub .btnLink01 a {
	min-width: 0;
	padding: 0 20px;
}
#navigation .megaMenu > .menuClose {
	clear: both;
	margin: 40px 0 0 0;
	text-align: center;
}
#navigation .megaMenu > .menuClose > a {
	display: inline-block;
	min-width: 146px;
	padding: 11px 20px 9px 15px;
	border-radius: 22px;
	background-color: #7c7071;
	color: #fff;
	font-weight: bold;
	text-decoration: none !important;
}
#navigation .megaMenu > .menuClose > a:before {
	content: "";
	display: inline-block;
	width: 18px;
	height: 18px;
	margin: 0 14px 0 0;
	background: url(/common-files/img/cmn_close_ic01.png) no-repeat 0 0;
	vertical-align: middle;
}
#navigation .recruitBtn {
	float: right;
	width: 168px;
}
#navigation .recruitBtn > a {
	display: block;
	padding: 15px 5px 13px;
	border-radius: 5px;
	border-right: 1px solid #cdcccc;
	border-bottom: 1px solid #cdcccc;
	background-color: #f8f3e9;
	color: #333333;
	font-size: 17px;
	font-size: 1.7rem;
	font-weight: bold;
	line-height: 1.25;
	text-decoration: none !important;
	text-align: center;
}
#navigation .recruitBtn > a > span {
	display: inline-block;
	padding: 0 0 0 33px;
	background-image: url(/common-files/img/cmn_recruit_ic01.png);
	background-repeat: no-repeat;
	background-position: 0 50%;
}
#navigation .recruitBtn > a:hover {
	background-color: #f8eae9;
}


/* Contents
------------------------------------------------------ */
#globalContents {
	clear: both;
	padding: 150px 0 0 0;
}
#contents {
	clear: both;
}

/*----- topicWrap -----*/
.topicWrap {
	clear: both;
	background-color: #f9f9f9;
}

/* pathNavi */
.pathNavi {
	width: 1000px;
	margin: 0 auto;
	padding: 12px 0;
}
.pathNavi .breadcrumbs {
}
.pathNavi .breadcrumbs > li {
	position: relative;
	float: left;
	margin: 0 8px 0 0;	
	padding: 0 17px 0 0;
	font-size: 13px;
	font-size: 1.3rem;
	line-height: 2.0;
}
.pathNavi .breadcrumbs > li:first-child {
	padding-left: 28px;
}
.pathNavi .breadcrumbs > li:last-child {
	margin-right: 0;
	padding-right: 0;
}
.pathNavi .breadcrumbs > li:first-child:before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	display: inline-block;
	width: 20px;
	height: 16px;
	margin: -10px 0 0 0;
	background: url(/common-files/img/cmn_bread_ic01.png) no-repeat 0 50%;
}
.pathNavi .breadcrumbs > li:after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	display: inline-block;
	width: 8px;
	height: 11px;
	margin: -6px 0 0 0;
	background: url(/common-files/img/cmn_bread_ic02.png) no-repeat 0 50%;
}
.pathNavi .breadcrumbs > li:last-child:after {
	display: none;
}

/*----- titleWrap -----*/
.titleWrap {
	clear: both;
	border-bottom: 1px solid #cccccc;
}

/*----- contentsWrap -----*/
.contentsWrap {
	clear: both;
	width: 1000px;
	margin: 0 auto;
	padding: 30px 0 0 0;
}
.noSide .contentsWrap {
	width: auto;
}

/*** main ***/
#main {
}

/* mainWrap */
[class^="mainWrap"] {
	clear: both;
}
[class^="mainWrap"] > *:first-child {
	margin-top: 0 !important;
}
.mainWrap01 {
	width: 1000px;
	margin: 0 auto;
	padding: 0 0 60px 0;
}
.mainWrap01 + .mainWrap01 {
	padding-top: 60px;
}
.mainWrap01.is-wide {
	width: auto;
	padding-top: 0 !important;
	padding-bottom: 0;
}


/* Footer
------------------------------------------------------ */
#globalFooter {
	clear: both;
	background-color: #e60012;
}
#footer {
	clear: both;
}

/*----- footerWrap01 -----*/
.footerWrap01 {
	clear: both;
	padding: 35px 0 10px;
	border-top: 2px solid #dfd7cb;
	background-color: #f8f3e9;
}
.footerWrap01 .ftrNavi {
	width: 1000px;
	margin: 0 auto;
}
.footerWrap01 .ftrNavi > .navBlock {
	float: left;
	width: 22.6%;
	margin: 0 0 0 3.2%;
}
.footerWrap01 .ftrNavi > .navBlock:nth-child(4n+1) { width: 24.6%; }
.footerWrap01 .ftrNavi > .navBlock:nth-child(4n+2) { width: 26.6%; }
.footerWrap01 .ftrNavi > .navBlock:nth-child(4n+3) { width: 24.6%; }
.footerWrap01 .ftrNavi > .navBlock:nth-child(4n+4) { width: 14.6%; }
.footerWrap01 .ftrNavi > .navBlock:nth-child(4n+1) {
	clear: left;
	margin-left: 0;
}
.footerWrap01 .ftrNavi > .navBlock > *:first-child {
	margin-top: 0 !important;
}
.footerWrap01 .ftrNavi > .navBlock .mainMenu {
	margin: 2em 0 0 0;
}
.footerWrap01 .ftrNavi > .navBlock .mainMenu > li {
}
.footerWrap01 .ftrNavi > .navBlock .mainMenu > li + li {
	margin-top: 2em;
}
.footerWrap01 .ftrNavi > .navBlock .mainMenu > li > a {
	color: #444444;
	font-size: 15px;
	font-size: 1.5rem;
	font-weight: bold;
}
.footerWrap01 .ftrNavi > .navBlock .mainMenu > li > a:hover {
	color: #666666;
}
.footerWrap01 .ftrNavi > .navBlock .mainMenu .subMenu {
	margin: 1em 0 0 0;
}
.footerWrap01 .ftrNavi > .navBlock .mainMenu .subMenu > li {
}
.footerWrap01 .ftrNavi > .navBlock .mainMenu .subMenu > li + li {
	margin-top: 0.75em;
}
.footerWrap01 .ftrNavi > .navBlock .mainMenu .subMenu > li > a {
	display: inline-block;
	padding: 0 0 0 14px;
	background: url(/common-files/img/cmn_link_ic03.png) no-repeat 0 0.35em;
	color: #666666;
	font-size: 15px;
	font-size: 1.5rem;
}
.footerWrap01 .ftrNavi > .navBlock .mainMenu .subMenu > li > a:hover {
	color: #888888;
}
.footerWrap01 .ftrNavi > .navBlock .ecBtn {
	margin-top: 2em;
}
.footerWrap01 .groupNavi {
	width: 1000px;
	margin: 15px auto 0;
}
.footerWrap01 .groupNavi > .groupLogo {
	text-align: right;
}
.footerWrap01 .groupNavi > .groupLogo img {
	max-width: 114px;
	height: auto;
}
.footerWrap01 .groupNavi > .link {
	text-align: right;
}
.footerWrap01 .groupNavi > .link > a {
	display: inline-block;
	padding: 0 0 0 16px;
	background: url(/common-files/img/cmn_blank_ic03.png) no-repeat 0 0.3em;
	color: #666666;
	font-size: 10.5px;
	font-size: 1.05rem;
}
.footerWrap01 .groupNavi > .link > a:hover {
	color: #888888;
}

/*----- footerWrap02 -----*/
.footerWrap02 {
	clear: both;
	position: relative;
	width: 1000px;
	margin: 0 auto;
	padding: 25px 0 20px;
}
.footerWrap02 #pageTopBtn {
}
.footerWrap02 #pageTopBtn > a {
	position: absolute;
	left: 50%;
	top: -22px;
	display: block;
	width: 52px;
	height: 52px;
	margin: 0 0 0 -26px;
	background-image: url(/common-files/img/cmn_pagetop_bt01.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 52px 52px;
	text-indent: -9999px;
	outline: none;
}
.footerWrap02 #pageTopBtn > a:hover {
	top: -27px;
}
.footerWrap02 .ftrUtility {
	float: left;
}
.footerWrap02 .ftrUtility > .utilMenu {
}
.footerWrap02 .ftrUtility > .utilMenu > li {
	float: left;
	margin: 0 28px 0 0;
}
.footerWrap02 .ftrUtility > .utilMenu > li > a {
	color: #fff;
	font-size: 13px;
	font-size: 1.3rem;
}
.footerWrap02 .ftrUtility > .utilMenu > li > a[target="_blank"]:after {
	content: "";
	display: inline-block;
	width: 10px;
	height: 10px;
	background-image: url(/common-files/img/cmn_blank_ic02.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	margin: 0 0 0 9px;
	vertical-align: middle;
}
.footerWrap02 .ftrIdentity {
	float: right;
}
.footerWrap02 .ftrIdentity #copyright {
	color: #fff;
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-size: 1.2rem;
	line-height: 2.0;
}



/********************************************************

  MEDIA

********************************************************/

/* Resposive
------------------------------------------------------ */
/*----- PC Only Layout -----*/
@media screen and (min-width: 751px) and (max-width: 4096px) {
	#navigation .spMenu {
		display: none !important;
	}
	.footerWrap01 .siteNavi {
		display: none !important;
	}
}
/*----- PC Layout -----*/
@media screen and (max-width: 1920px) {
}
@media screen and (max-width: 1536px) {
}
@media screen and (max-width: 1280px) {
}
@media screen and (max-width: 1080px) {
}
@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 960px) {
}
@media screen and (max-width: 800px) {
}
@media screen and (max-width: 768px) {
}
@media screen and (max-width: 751px) {
}



/* Clearfix
------------------------------------------------------ */
.headerWrap01:after,
.headerWrap01 .hdrUtility:after,
.headerWrap01 .hdrUtility .utilMenu:after,
#navigation:after,
#navigation .commonMenu:after,
#navigation .megaMenu > .menuContent .menuLayout01:after,
#navigation .megaMenu > .menuContent .menuList03:after,
#navigation .megaMenu > .menuContent .menuList04:after,
.pathNavi .breadcrumbs:after,
.footerWrap01 .ftrNavi:after,
.footerWrap02:after,
.footerWrap02 .ftrUtility > .utilMenu:after {
	content: "";
	display: block;
	clear: both;
}