/* CSS Document */

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

top-contents
=================================================*/

.top-copy {
	width: 90%;
	max-width: 550px;
	margin: 100px auto 0;
}
.top-image {
	width: 100%;
	max-height: 800px;
	background-color: #FFF;
	position: relative;
	margin-top: 175px;
}
.top-image .inner {
	width: 90%;
	max-width: 1000px;
	position: absolute;
    top: 45%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	z-index: 2!important;
}
.top-image .inner h1 {
	font-weight: 600;
	line-height: 150%;
	font-style: italic;
}

.top-image .inner h1.wh {
	color: #FFF;
}
.top-image .inner h1.pi {
	color: #ff0072;
}
.top-image .inner h1.ri {
	text-align: right;
}
.top-image .inner h1.ss {
	font-size: 4rem;
}
.top-image .sub-item {
	width: 12.6%;
	max-width: 126px;
	height: auto;
	position: absolute;
    top: 50%;
	left: 48%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	z-index: 3!important;
}
.top-image .inner h1 span {
	width: 100%;
	max-width: 240px;
	display: block;
	font-size: 1.5rem;
	line-height: 160%;
	color: #FFF;
	text-align: center;
	background-color: #000;
	margin-bottom: 3%;
	padding: 8px;
}
.top-image .inner h1.ri span {
	margin-left: auto;
	margin-right: 0;
}
.top-image .inner h1 span.ll {
	max-width: 280px;
}
.top-image .inner h1.pi span {
	width: 100%;
	max-width: 100%;
	display: block;
	font-size: 1.5rem;
	line-height: 160%;
	color: #ff0072;
	text-align: left;
	font-style: normal;
	background-color: transparent;
	margin-top: 1.5%;
	margin-bottom: 0;
	padding: 0;
}
.page-head-copy {
	font-size: 3.5rem;
	font-weight: 600;
	text-align: center;
	line-height: 180%;
	margin-bottom: 5%;
}

.page-inner-title {
	font-size: 3.5rem;
	font-weight: 600;
	text-align: center;
	line-height: 180%;
	margin-top: 3%;
}
.red-title {
	color: #ea007f;
}
.sub-title {
	font-size: 2.2rem;
	font-weight: 600;
	text-align: center;
	color: #000;
	background: #09e1ff;
	background-image: url(../../images/corner.png),url(../../images/corner2.png);
	background-position: left top,right bottom;
	background-repeat: no-repeat,no-repeat;
	background-size: 4%,4%;
	margin-top: 6%;
	padding: 15px 10px;
}
.small-title {
	font-size: 2.2rem;
	font-weight: 600;
	text-align: center;
	background-image: url(../../images/pg_parts_03.png);
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: auto;
	margin-top: 5%;
	padding-bottom: 3%;
}
.small-title span {
	font-size: 1.6rem;
}

.category-title {
	font-size: 2.2rem;
	text-align: center;
	color: #FFF;
	background-position: right top;
	background-repeat: no-repeat;
	background-size: contain;
	padding: 18px;
}
.t-color1 {
	background-color: #046fe5;
	background-image: url(../../departments/images/top_b_s.png);
}
.t-color2 {
	background-color: #6ca600;
	background-image: url(../../departments/images/top_b2_s.png);
	margin-top: 8%;
}
.t-color3 {
	background-color: #d43d72;
	background-image: url(../../departments/images/top_b3_s.png);
	margin-top: 8%;
}
.t-color4 {
	background-color: #6e00d5;
	background-image: url(../../departments/images/top_b4_s.png);
	margin-top: 8%;
}

.att-box1 {
	text-align: center;
	font-weight: 600;
	color: #000;
	background: #81f0ff;
	padding: 3%;
	border: 3px solid #000;
}
.att-box1 small {
	color: #999;
}
.att-box1 span {
	color: #F00;
	text-decoration: underline;
}
.att-s {
	width: 30%;
	max-width: 300px;
	float: right;
	font-size: 1.2rem;
	text-align: left;
	line-height: 180%;
	color: #999;
	margin-top: 3%;
}
.att-s2 {
	font-size: 1.2rem;
	text-align: right;
	line-height: 180%;
}
.page-2cul-b {
	width: 100%;
}
.page-2cul-b section {
	width: 48%;
	float: left;
	margin-top: 3%;
}
.page-2cul-b section:nth-of-type(2n) {
	width: 48%;
	float: right;
}
.button-2cul {
	width: 100%;
}
.button-2cul dd {
	width: 50%;
	text-align: center;
	float: left;
	padding: 0 2.5%;
}
.credit-item h3 {
	color: #000;
	font-weight: 600;
	padding-bottom: 3%;
}
.credit-item .credit-box {
	width: 100%;
	display: table;
}
.credit-item .credit-box dt {
	width: 50%;
	display: table-cell;
	text-align: left;
	vertical-align: middle;
}
.credit-item .credit-box dt img {
	width: 100%;
	max-width: 100%;
	height: auto;
}
.credit-item .credit-box dd {
	display: table-cell;
	text-align: left;
	vertical-align: middle;
	padding-left: 12px;
}
.list-border {
	margin-top: 3%;
}
.list-border dd {
	border-bottom: 1px solid #000;
	padding: 8px 0;
}

/* inner menu */

.inner-menu {
	width: 100%;
	max-width: 1000px;
	display: table;
	background: #000;
	border-top: 3px solid #09e1ff;
	margin: 8% auto 0;
	padding: 15px 0 30px;
}
.inner-menu dt {
	width: 100%;
	font-size: 1.6rem;
	color: #09e1ff;
	text-align: center;
	vertical-align: middle;
	padding: 15px 15px 0;
}
.inner-menu dd {
	width: 100%;
	text-align: left;
	vertical-align: middle;
}
.inner-menu dd ul {
	text-align: center;
	line-height: 140%;
}
.inner-menu dd ul li {
	display: inline-block;
	margin: 20px 15px 0;
}
.inner-menu dd li a {
	font-size: 1.4rem;
	color: #FFF;
	text-decoration: none;
}
.inner-menu dd li a i {
	color: #09e1ff;
}

.pict-item {
	width: 100%;
	margin-top: 5%;
}
.pict-item-nm {
	width: 100%;
}
.pict-item-hf {
	width: 100%;
	max-width: 500px;
	margin: 5% auto 0;
}
.banner-item {
	width: 100%;
	max-width: 720px;
	margin: 0 auto;
}

.link-list {
	
}
.link-list li {
	font-size: 1.4rem;
	padding: 10px 1em;
	border-bottom: 1px solid #CCC;
}


/* cf */
.page-2cul-b:after,.button-2cul:after {
	content:" ";
	display:block;
	clear:both;
}


/* top img */

.top-image img,.top-image .photo img,.top-copy img,.pict-item img,.pict-item-nm img,.pict-item-hf img,.banner-item img,.button-2cul dd img {
	width: 100%;
	max-width: 100%;
	height: auto;
}

@media only screen and (min-width:1px) and (max-width: 1130px) {

	.top-image {
		margin-top: 172px;
	}
	.top-image .inner h1 {
		font-size: 4vw;
	}
	.top-image .inner h1.ss {
		font-size: 3.5vw;
	}
	.top-image .inner h1 span {
		width: 13em;
		font-size: 1.3vw;
		padding: 6px;
	}
	.top-image .inner h1 span.ll {
		width: 17em;
	}
	.page-head-copy {
		font-size: 3vw;
	}
	.page-inner-title {
		font-size: 3vw;
	}
}
@media only screen and (min-width:1px) and (max-width: 768px) {
	
	.top-image {
		margin-top: 70px;
	}
	.top-image .inner h1 {
		font-size: 2rem;
	}
	.page-head-copy,.page-inner-title {
		font-size: 2rem;
	}
	.sub-title {
		font-size: 1.8rem;
	}
	.small-title {
		font-size: 1.6rem;
		line-height: 180%;
	}
	.small-title span {
		font-size: 1.4rem;
	}
	.category-title {
		font-size: 1.8rem;
	}
	.page-2cul-b section {
		width: 100%;
		float: none;
		margin-top: 5%;
	}
	.page-2cul-b section:nth-of-type(2n) {
		width: 100%;
		float: none;
	}
	.att-s {
		width: 100%;
		max-width: 100%;
	}
	.inner-menu dd ul {
		text-align: left;
	}
	.inner-menu dd ul li {
		display: inline-block;
		margin: 15px 15px 0;
	}
}

@media only screen and (min-width:1px) and (max-width: 568px) {
	
	.page-head-copy,.page-inner-title {
		text-align: left!important;
	}
	.page-head-copy br,.page-inner-title br {
		display: none;
	}
	

}
	
@media only screen and (min-width:1px) and (max-width: 480px) {
	
	.button-2cul dd {
		width: 90%;
		text-align: center;
		float: none;
		margin: 0 auto 5%;
		padding: 0;
	}

}