@charset "utf-8";

/* common =============================================================
	
	Header
	Footer
	Link
	Colors
	Text
	Line spacing
	Opacity
	Page title
	Section / Section title
	Button
	List
	Page top
	Table
  Youtube
	
======================================================================== */


/*  Logo
======================================================================== */

		img.p-logo-img {
			width: 270px;
			height: 41px;
			}
	@media screen and (max-width: 768px) {
		/*SP*/
		img.p-logo-img.small {
			width: 180px !important;
			height: 27.333px !important;
			}
	}



/* =====================================================================

	Header
	
======================================================================== */

	@media print, screen and (min-width: 769px) {
		/*TB,PC*/
		.is-header-fixed {
			position: absolute;
			z-index: 1000;
			left: 0;
			right: 0;
			margin: 0 auto;
			width: 1000px;
			}
	}
	@media screen and (max-width: 768px) {
		/*SP*/
		.is-header-fixed {
			position: fixed;
			width: 100%;
			height: 50px;
			top: 0;
			left: 0;
			background-color: rgba(255,255,255,0.9);
			z-index: 500;
			}
		.p-logo {
			margin-left: 16px;
			margin-top: 10px;
			}			
	}
	
	
	
	/*----------------------------------------------------
	
		 hamburger menu (SP only)
		 
	----------------------------------------------------*/
	@media print, screen and (min-width: 769px) {
		/*TB,PC*/
		.p-btnMenu,
		.p-navigation {
			display: none;
			}
	}
	@media screen and (max-width: 768px) {
		/*SP*/
		.l-header .l-wrap {
			margin: 0;
			}
		.is-header-fixed {
			border-top: solid 3px #4B73A1;
			border-bottom: solid 1px #D2D8DF;
			box-sizing: border-box;
			}
		.p-btnMenu {
			cursor: pointer;
			display: block;
			position: fixed;
			top: 0;
			right: 0;
			z-index: 51;
			width: 50px;
			height: 50px;
			background: url(../img/common/btn_menu.png) no-repeat;
			background-size: 50px 50px;
			}
		.p-btnMenu.is-toggle {
			background: url(../img/common/btn_menu_close.png) no-repeat !important;
			background-size: 50px 50px !important;
			}
		.p-navigation {
			display: none;
			position: fixed;
			z-index: 9000;
			top: 50px;
			width: 100vw;
			height: auto;
			background-color: #4B73A1;
			}	
		.p-navigation .c-icon {
			color: #FFF;
			margin-right: 0.8rem;
			font-size: 1.8rem;
			position: relative;
			top: 3px;
			}
		.c-nav-list-items a {
			position: relative;
			display: block;
			border-bottom: solid 1px #8aa7c8;
			box-sizing: content-box;
			color: #FFF !important;
			text-decoration: none !important;
			padding: 12px 10% 12px 16px;
			}
			.c-nav-list-items a:before{
				display: block;
				content: "";
				position: absolute;
				-webkit-transform: rotate(45deg);
				transform: rotate(45deg);
				top: 50%;
				right: 20px;
				width: 9px;
				height: 9px;
				margin-top: -5px;
				background-color: #FFF;
				}
			.c-nav-list-items a:after{
				display: block;
				content: "";
				position: absolute;
				-webkit-transform: rotate(45deg);
				transform: rotate(45deg);
				top: 50%;
				right: 23px;
				width: 9px;
				height: 9px;
				margin-top: -5px;
				background-color: #4B73A1;
				}
			.c-nav-list-items.c-child a {
				background-color: #233d6d;
				border-top: dotted 1px #385384;
				margin-top: -1px;
				}
				.c-nav-list-items.c-child a:after{
					background-color: rgba(35,61,109,1);
					}
			.c-nav-list-items.c-child .icon-recruit {
				color: #233d6d;
				}
	}


	
	/*	l-gnav (PC only)
	----------------------------------------------------*/
		.is-scroll {
			border-bottom: solid 1px #D2D8DF;
			}
		.l-header .l-gnav {
			height: 75px;
			border-top: solid 10px #4B73A1;
			box-sizing: border-box;
			z-index: 2;
			background: -moz-linear-gradient(top,  rgba(255,255,255,0.8) 20%, rgba(255,255,255,1) 100%);
			background: -webkit-linear-gradient(top,  rgba(255,255,255,0.8) 20%,rgba(255,255,255,1) 100%);
			background: linear-gradient(to bottom,  rgba(255,255,255,0.8) 20%,rgba(255,255,255,1) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99ffffff', endColorstr='#ffffff',GradientType=0 );
			}
		.l-gnav .p-logo {
			width: 25%;
			margin-top: 12px;
			position: absolute;
			left: 20px;
			}
		.l-gnav .p-gnavigation {
			text-align: right;
			width: 55%;
			margin: 20px auto 0;
			}
		.c-gnav-list-items {
			display: inline;
			letter-spacing: -.40em; /* 文字間を詰めて隙間を削除 */
			}
		.c-gnav-list-items a {
			display: inline-block;
			letter-spacing: normal; /* 文字間を通常に戻す */
			text-align: center;
			width: 120px;
			font-weight: bold;
			color: #2B4059;
			box-shadow: 1px 0 0 0px #FFF inset;
			}
		.l-gnav .c-gnav-list-items a {
			border-left: solid 1px #A6CCE5;
			}
		.l-gnav .p-gnavigation {
			border-right: solid 1px #FFF;
			box-shadow: -1px 0 0 0px #A6CCE5 inset;
			}
		.l-gnav .p-htel {
			position: absolute;
			top: 10px;
			right: 20px;
			}
			
		/* for gNav Fix */
		.gnav-fixed,
		.fixed {
			position: fixed;
			width: 100%;
		 	z-index: 1000;
			top: 0px;
			}
	@media screen and (min-width: 769px) and (max-width: 1180px) {
		/*TB*/
		.l-header .l-gnav {
			padding-right: 1%;
			}
		.l-gnav .p-logo {
			left: 1%;
			width: 35%;
			}
		.l-gnav .p-gnavigation {
			width: 100%;
			}
		.l-gnav .c-gnav-list-items a {
			width: 110px;
			}
		.l-gnav .p-htel {
			display: none;
			}
	}



/* =====================================================================

	Footer
	
======================================================================== */

		.l-footer {
			background-color: #4B73A1;
			color: #FFF;
			}
		.p-footer-logo {
			margin-bottom: 1.2rem;
			}

	
	/*	p-fnav (PC only)
	----------------------------------------------------*/
		.p-fnav a {
			color: #FFF;
			}
		.p-fnav .c-gnav-list-items:last-child a {
			border-right: solid 1px #FFF;
			}
	@media print, screen and (min-width: 769px) {
		/*TB,PC*/
		.l-footer .l-wrap {
			padding-top: 4rem;
			font-size: 1.4rem;
			}
		.p-fnav {
			margin-bottom: 6rem;
			}
		.p-footer-logo {
			margin-bottom: 2rem;
			}
		.p-copy {
			padding-top: 100px;
			padding-bottom: .8rem;
			}
	}
	@media screen and (max-width: 768px) {
		/*SP*/
		.l-footer .l-wrap {
			padding-top: 2rem;
			}
		.p-copy {
			padding-top: 1.4rem;
			padding-bottom: .8rem;
			}
	}



/* =====================================================================

	Link
	
======================================================================== */
	
	a.u-external-link {
		color: #900;
		text-decoration: underline;
		}
	a.u-external-link:hover {
		text-decoration: none;
		}	
		

/* =====================================================================

	Colors
	
======================================================================== */

	.u-cBlue					{ color: #4B729F !important; }
	.u-cBlue2					{ color: #4B73A1 !important; }
	.u-cBlue-dark			{ color: #1F2E40 !important; }
	.u-cMidnightblue	{ color: #2B4059 !important; }
	
	.u-cAzuki					{ color: #660000 !important; }

		

/* =====================================================================

	Text
	
======================================================================== */

	.c-textshadow-white {
			text-shadow: 0 0 10px #FFFFFF,0 0 10px #FFFFFF,0 0 10px #FFFFFF,0 0 10px #FFFFFF,
									 0 0 20px #FFFFFF,0 0 20px #FFFFFF,0 0 20px #FFFFFF,0 0 20px #FFFFFF,
								   0 0 20px #FFFFFF,0 0 20px #FFFFFF,0 0 20px #FFFFFF,0 0 20px #FFFFFF;
		}
		
		

/* =====================================================================

	Line spacing
	
======================================================================== */

	@media print, screen and (min-width: 769px) {
		/*TB,PC*/
		.c-textarea-multiline {
			line-height: 220%;
			}
	}



/* =====================================================================

	Opacity
	
======================================================================== */
	
		.action_hover {
			opacity: 1;
			transition: 400ms ease opacity;
			}
		.action_hover:hover {
			opacity: 0.7;
			}
		.action_hover:active {
			opacity: 0.5;
			}
		
	@media (max-width: 768px) {
		.action_hover {
			opacity: 1 !important;
		}
	}



/* =====================================================================

	Page title
	ページタイトル装飾
	
======================================================================== */
		
		.l-pageVisual {
			background-color: #E2EAF1;
			}
		.p-pageVisual-title {
			text-align: center;
			color: #2B4059;
			letter-spacing: .2rem;
			background-image: url(../img/common/pageVisual_line.png);
			background-repeat: no-repeat;
			background-position: center 70%;
			background-size: 50px 8px;
			}
	@media print, screen and (min-width: 769px) {
		/*TB,PC*/
		.l-pageVisual {
			position: relative;
			top: 75px;
			}
		.p-pageVisual-title {
			font-size: 3.0rem;
			font-weight: normal;
			padding: 35px 0 50px;
			}
	}
	@media screen and (max-width: 768px) {
		/*SP*/
		.l-pageVisual {
			position: relative;
			top: 50px;
			}
		.p-pageVisual-title {
			font-size: 160%;
			font-weight: bold;
			padding: 1.4rem 0 2.8rem;
			background-position: center 72%;
			}
	}
	@media screen and (min-width: 769px) and (max-width: 1025px) {
		/*TB*/
		.p-pageTitle {
			padding-left: 1%;
			padding-right: 1%;
			}
	}



/* =====================================================================

	Section / Section title
	
======================================================================== */
	
		.p-section {
			box-sizing: border-box;
			}	
		.p-sectionTitle {
			text-align: center;
			font-weight: normal;
			letter-spacing: .2rem;
			display: block;
			margin-bottom: 2.0rem;
			}
		.p-sectionTitle span.c-grayline {
			display: inline-block;
			padding-bottom: .6rem;
			border-bottom: solid 1px #CCCCCC;
			}
		.p-sectionTitle span.c-blueline {
      display: inline-block;
			padding-bottom: .6rem;
			border-bottom: solid 1px #4B73A1;
			}
	@media print, screen and (min-width: 769px) {
		/*TB,PC*/
		.p-section {
			margin: 9.0rem 0;
			}
		.home .p-section {
			padding: 5.0rem 0;
			margin: 0;
			}
		.p-sectionTitle {
			font-size: 24px;
			}
		.p-section-textarea {
			padding-top: 1.6rem;
			}
	}
	@media screen and (max-width: 768px) {
		/*SP*/	
		.p-section {
			margin: 5rem 0;
			}	
		.home .p-section {
			padding: 5rem 0;
			margin: 0;
			}
		.p-sectionTitle {
			font-size: 160%;
			}
		.p-section-textarea {
			padding-top: 1.2rem;
			}
	}



/* =====================================================================

	Button
	
======================================================================== */

	.c-button,
	.c-button::before,
	.c-button::after {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		-webkit-transition: all .3s;
		transition: all .3s;
		}
	.c-button {
		display: block;
		padding: 1.0rem 0;
		box-sizing: border-box;
		}

	.c-button-circle {
		display: inline-block;
		text-align: center;
		font-size: 96%;
		width: 77px;
		height: 77px;
		line-height: 75px;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		border-radius: 50%;
		}
	
	.c-button-more {
		display: inline-block;
		text-align: center;
		font-weight: bold;
		border: solid 1px #990000;
		background-color: #990000;
		color: #FFFFFF !important;
		border-radius: 25px;
		-webkit-border-radius: 25px;
		-moz-border-radius: 25px;
		padding-left: 2rem;
		padding-right: 2rem;
		}
	.c-button-more:hover {
		background-color: #FFF;
		color: #990000 !important;
		}
	@media print, screen and (min-width: 769px) {
		/*TB,PC*/
		.c-button-more {
			width: 240px;
			}
	}
	@media screen and (max-width: 768px) {
		/*SP*/
		.c-button-more {
			display: block;
			}	
	}
	
	

/* =====================================================================

	List
	
======================================================================== */

		.c-list-disc {
			list-style-type: disc;
			margin-left: 1.6rem;
			}
		.p-list-decimal {
			list-style-type: decimal;
			margin-left: 1.6rem;
			}
			


/* =====================================================================

	Pagetop
	
======================================================================== */

	.c-pagetop {
		display: none;
		position: fixed;
		bottom: 20px;
		right: 20px;
		}
	.c-pagetop .c-button-circle {
		display: block;
		width: 50px;
		height: 50px;
		line-height: 2px;
		background-color: #3b5a7e !important;
		text-align: center;
		font-size: 24px;
		text-decoration: none;
		}
	.c-pagetop i {
		color: #FFF;
		}
	.c-pagetop .c-button-circle:hover {
		background-color: #1F2E40 !important;
		}



/* =====================================================================

	Table
	
======================================================================== */

		.p-table {
			width: 100%;
			max-width: 100%;
			overflow-x: auto;
			border-collapse: collapse;
			border-top: solid 1px #CCCCCC;
			}
		.p-table th,
		.p-table td {
			text-align: left;
			font-weight: normal;
			box-sizing: border-box;
			border-bottom: solid 1px #CCCCCC;
			}
		.p-table th {
			text-align: left;
			font-weight: normal;
			color: #4B729F;
			vertical-align: middle !important;
			}
		.p-table td {
			}
	@media print, screen and (min-width: 769px) {
		/*TB,PC*/
		.p-table th,
		.p-table td {
			vertical-align: top;
			padding: 1.4rem;
			}
		.p-table th {
			width: 140px;
			}
		.u-w140 { width: 140px; }
	}		
	@media screen and (max-width: 768px) {
		/*SP*/
		.p-table th,
		.p-table td {
			display: block;
			padding: 0.8rem;
			}
		.p-table th {
			border-bottom: none;
			padding-bottom: 0;
			}
		.p-table td {
			padding-top: 0.4rem;
			}
	}



/* =====================================================================

	Youtube
	
======================================================================== */

    .p-youtube {
      position: relative;
      width: 100%;
      padding-top: 56.25%;
      }
    .p-youtube iframe {
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      }