@charset "utf-8";
/*------------------------------------------------------------
	トープページ
------------------------------------------------------------*/
#main {
	padding: 155px 0 0;
}

#main h2 {
	margin-bottom: 135px;
	text-align: center;
}

#main .mainImg {
	margin-bottom: 60px;
}

#main .mainImg img {
	width: 100%;
}

#main h3 {
	margin-bottom: 43px;
	text-align: center;
}

#main .txtBox {
	margin: 0 auto 60px;
	width: 760px;
}

#main .txtBox01 {
	margin-bottom: 75px;
}

#main p {
	margin-bottom: 30px;
	font-size: 14px;
	line-height: 2.15;
}

#main .innerBox {
	margin-bottom: 80px;
	overflow: hidden;
}

#main .innerBox .photo01 {
	margin-bottom: -190px;
	text-align: right;
}

#main .innerBox .textBox {
	margin-bottom: 55px;
	width: 767px;
}

#main .innerBox .textBox h4 {
	margin-bottom: 20px;
}

#main .innerBox .textBox01 {
	margin: 0 175px 55px;
}

#main .innerBox .textBox02 {
	margin-bottom: -275px;
	float: right;
	position: relative;
}

#main .innerBox .textBox02 p {
	position: relative;
	z-index: 10;
}

#main .innerBox01 .photo01 {
	margin-bottom: -45px;
}

#main .innerBox01 .textBox02 {
	margin-bottom: -160px;
}

#main .imgBox {
	margin-bottom: 150px;
}

#main .imgBox .photoBox {
	float: left;
}

#main .imgBox .textBox {
	float: right;
	width: 536px;
}

#main .imgBox .textBox h4 {
	margin-bottom: 42px;
}

#main .imgBox .textBox p {
	margin-bottom: 0;
	font-size: 13px;
	line-height: 2;
}

#main .imgBoxR .photoBox {
	float: right;
}

#main .imgBoxR .textBox {
	float: left;
}

#main .mainImg.last {
	margin-bottom: 0;
	position: relative;
}

#main .mainImg.last .logoBox {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
}

#main .mainImg.last .logoBox .logo {
	margin-top: 250px;
	text-align: center;
}

#main .mainImg.last .logoBox .logo img {
	width: auto;
}

#main .jsImg {
	opacity: 0;
	-webkit-transition: opacity 0.5s linear;
	transition: opacity 0.5s linear;
}

#main .expanded {
	opacity: 1;
}

/*------------------------------------------------------------
	pyramid
------------------------------------------------------------*/
#pyramid #main {
	padding: 0;
}

#pyramid #main .mainBox {
	margin-top: 0;
	padding: 0 0 95px;
	background-color: #FFF;
	border-bottom: 1px solid #EDEDED;
}

#pyramid #main .ttlBox {
	margin-bottom: 96px;
	padding: 82px 0;
	background-color: #000;
}

#pyramid #main .ttlBox h2 {
	margin-bottom: 0;
}

#pyramid #main .comSec {
	width: 760px;
}

#pyramid #main .comSec h3 {
	margin-bottom: 35px;
}

#pyramid #main .comSec p {
	margin-bottom: 88px;
}

#pyramid #main .bgBox {
	margin-bottom: 100px;
	padding: 125px 0 133px;
	background: #005BA1 url(../img/about/pyramid/bg_box_bg01.gif) no-repeat center 70px;
}

#pyramid #main .bgBox p {
	margin-bottom: 0;
	color: #FFF;
	line-height: 2.3;
}

#pyramid #main .bgBox02 {
	background: #542E81 url(../img/about/pyramid/bg_box_bg02.gif) no-repeat center 70px;
}

#pyramid #main .comSec .h3Ttl {
	margin-bottom: 45px;
}

#pyramid #main .comSec .text {
	margin-bottom: 0;
	text-align: center;
}

#pyramid #main .scrollBox {
	margin-bottom: 115px;
	position: relative;
}

#pyramid .makeMeScrollable {
	margin: 0 60px;
	position: relative;
}

#pyramid div.scrollingHotSpotLeft {
	position: absolute;
	left: -60px;
	top: 0;
	height: 100%;
	width: 130px;
	z-index: 10;
	cursor: pointer;
	background: url(../img/about/pyramid/prev_bg.png) no-repeat right center;
}

#pyramid div.scrollingHotSpotRight {
	position: absolute;
	right: -60px;
	top: 0;
	height: 100%;
	width: 130px;
	z-index: 10;
	cursor: pointer;
	background: url(../img/about/pyramid/next_bg.png) no-repeat left center;
}

#pyramid div.scrollWrapper {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100%;
}

#pyramid div.scrollableArea {
	position: relative;
	width: auto;
	height: 100%;
}

#pyramid .makeMeScrollable div.scrollableArea img {
	position: relative;
	float: left;
	margin: 0 4px;
	padding: 0;
	width: 305px;
}

#pyramid #main .scrollBox02 {
	margin-bottom: 100px;
	background: url(../img/about/pyramid/slide_arrow.png) no-repeat 400px 160px;
}

#pyramid #main .scrollBox02 .makeMeScrollable div.scrollableArea img {
	margin: 0 10px;
	width: auto;
}

#pyramid .pcH {
	height: auto;
	overflow: hidden;
}

#pyramid .spH {
	height: 0;
	overflow: hidden;
}

/*------------------------------------------------------------
	diamond
------------------------------------------------------------*/
#diamond #main {
	padding: 140px 0 0;
}

#diamond #main h2 {
	margin-bottom: 27px;
}

#diamond #main h2 img {
	width: 360px;
}

#diamond #main .topTxt {
	margin-bottom: 185px;
	padding: 16px 0 5px;
	text-align: center;
	background-color: #E4007F;
}

#diamond #main .topTxt p {
	margin-bottom: 0;
}

#diamond #main .mainBox {
	margin-top: 0;
	padding: 0 0 60px;
	background-color: #FFF;
	border-bottom: 1px solid #EDEDED;
}

#diamond #main .mainBox .imgBox {
	margin-bottom: 130px;
}

#diamond #main .mainBox .imgBox .textBox {
	width: 650px;
}

#diamond #main .mainBox .imgBox .textBox h3 {
	margin-bottom: 45px;
}

#diamond #main .mainBox .imgBox .textBox p {
	margin-bottom: 29px;
	font-size: 14px;
	line-height: 2.2;
}

#diamond #main .mainBox .imgBox .photoBox {
	margin: 172px 0 0 35px;
}

#diamond #main .mainBox .imgBox .photoBox img {
	width: 298px;
}

#diamond #main .mainBox .imgBoxR {
	margin-bottom: 90px;
}

#diamond #main .mainBox .imgBoxR .photoBox {
	margin-top: 245px;
}

#diamond #main .mainBox .imgBoxR .photoBox img {
	width: auto;
}

#diamond #main .mainBox .txtBox {
	margin-bottom: 130px;
	width: 767px;
}

#diamond #main .mainBox .txtBox .txt01 {
	margin-bottom: 72px;
}

#diamond #main .mainBox .btmInner {
	padding: 125px 0 90px;
	border-top: 3px solid #E4007F;
	border-bottom: 3px solid #E4007F;
}

#diamond #main .mainBox .btmInner h3 {
	margin-bottom: 0;
}

#diamond #main .mainBox .btmInner h3 img {
	width: 244px;
}

@media all and (min-width: 0) and (max-width: 768px)  {
	#pyramid .pcH {
		height: 0;
	}
	
	#pyramid .spH {
		height: auto;
	}
	
	#main {
		padding: 75px 0 0;
	}
	
	#main h2 {
		margin-bottom: 85px;
	}

	#main h2 img {
		width: 278px;
	}
	
	#main .mainImg {
		margin-bottom: 45px;
	}

	#main .comSec {
		margin: 0;
	}
	
	#main h3 {
		margin: 0 25px 25px;
		text-align: left;
	}

	#main h3 img {
		width: 270px;
	}
	
	#main .txtBox {
		margin: 0 25px 38px;
		width: auto;
	}
	
	#main .txtBox01 {
		margin-bottom: 35px;
	}
	
	#main p {
		margin-bottom: 25px;
		font-size: 12px;
		line-height: 1.8;
	}
	
	#main .innerBox {
		margin-bottom: 40px;
	}
	
	#main .innerBox .photo01 {
		margin-bottom: -35%;
	}

	#main .innerBox .photo01 img,
	#main .innerBox .photo02 img {
		width: 100%;
	}
	
	#main .innerBox .textBox {
		margin: 0 0 32px 7%;
		width: 68%;
	}

	#main .innerBox .textBox h4 img {
		width: 205px;
	}
	
	#main .innerBox .textBox01 {
		margin: 0 0 -47% 26%;
		position: relative;
	}
	
	#main .innerBox .textBox01 h4 img {
		width: 155px;
	}

	#main .innerBox .textBox02 {
		margin: 0 7%;
		float: none;
		width: auto;
	}

	#main .innerBox .textBox02 h4 img {
		width: 265px;
	}

	#main .innerBox .photo02 {
		margin-bottom: 40px;
	}
	
	#main .innerBox01 .photo01 {
		margin-bottom: 5px;
	}

	#main .innerBox01 .textBox h4 img {
		width: 170px;
	}

	#main .innerBox01 .textBox01 {
		margin-bottom: -13%;
	}

	#main .innerBox01 .textBox01 h4 img {
		width: 190px;
	}
	
	#main .innerBox01 .textBox02 {
		margin-bottom: 0;
	}

	#main .innerBox01 .textBox02 h4 img {
		width: 210px;
	}
	
	#main .imgBox {
		margin-bottom: 40px;
	}
	
	#main .imgBox .photoBox {
		margin-bottom: 30px;
		float: none;
	}

	#main .imgBox .photoBox img {
		width: 100%;
	}
	
	#main .imgBox .textBox {
		margin: 0 25px;
		float: none;
		width: auto;
	}
	
	#main .imgBox .textBox h4 {
		margin-bottom: 20px;
	}

	#main .imgBox .textBox h4 img {
		width: 270px;
	}

	#main .imgBox .textBox p {
		font-size: 12px;
		line-height: 1.8;
	}
	
	#main .imgBoxR .photoBox {
		float: none;
	}
	
	#main .imgBoxR .textBox {
		float: none;
	}
	
	#main .mainImg.last .logoBox .logo {
		margin-top: 23%;
	}
	
	#main .mainImg.last .logoBox .logo img {
		width: 152px;
	}
	
	#main .jsImg {
		opacity: 1 !important;
	}
	
	/*------------------------------------------------------------
		pyramid
	------------------------------------------------------------*/
	#pyramid #gHeader {
		background-color: #000;
	}

	#pyramid #main .mainBox {
		padding-bottom: 75px;
	}

	#pyramid #main .ttlBox {
		margin: 0 0 40px;
		padding: 28px 0 77px;
	}

	#pyramid #main .ttlBox h2 img {
		width: 220px;
	}
	
	#pyramid #main .comSec {
		margin: 0 25px;
		width: auto;
	}
	
	#pyramid #main .comSec h3 {
		margin: 0 0 30px;
		text-align: center;
	}

	#pyramid #main .comSec h3 img {
		width: 260px;
	}
	
	#pyramid #main .comSec p {
		margin-bottom: 50px;
		line-height: 1.9;
	}
	
	#pyramid #main .slideBox {
		margin: 0 0 45px;
		position: relative;
		padding-bottom: 35px;
	}
	
	#pyramid #main .slideBox .bx-prev,
	#pyramid #main .slideBox .bx-next {
		position: absolute;
		top: auto;
		bottom: 0;
	}
	
	#pyramid #main .slideBox .bx-prev {
		left: 21px;
	}
	
	#pyramid #main .slideBox .bx-next {
		right: 21px;
	}
	
	#pyramid #main .slideBox .bx-prev img,
	#pyramid #main .slideBox .bx-next img {
		margin: 0;
		width: 10px;
	}
	
	#pyramid #main .slideBox li {
		margin: 0;
		float: left;
		text-align: center;
	}

	#pyramid #main .slideBox li img {
		width: 72%;
		height: auto;
	}

	#pyramid #main .slideBox02 {
		margin-bottom: 50px;
		background: none;
	}

	#pyramid #main .slideBox02 li img {
		width: 90%;
	}
	
	#pyramid #main .bgBox {
		margin-bottom: 50px;
		padding: 32px 0 37px;
		background: #005BA1 url(../img/about/pyramid/bg_box_bg01.gif) no-repeat center 35%;
		background-size: 250px auto;
	}
	
	#pyramid #main .bgBox p {
		margin-bottom: 0;
		line-height: 1.9;
	}
	
	#pyramid #main .bgBox02 {
		background: #542E81 url(../img/about/pyramid/bg_box_bg02.gif) no-repeat center 35%;
	}

	#pyramid #main .comSec .h3Ttl {
		margin-bottom: 30px;
	}

	#pyramid #main .comSec .h3Ttl img {
		width: 219px;
	}
	
	#pyramid #main .text img {
		width: 280px;
	}

	/*------------------------------------------------------------
		diamond
	------------------------------------------------------------*/
	#diamond #main {
		padding: 77px 0 0;
	}
	
	#diamond #main h2 {
		margin-bottom: 18px;
	}

	#diamond #main h2 img {
		width: 228px;
	}
	
	#diamond #main .topTxt {
		margin-bottom: 105px;
		padding: 12px 0;
	}

	#diamond #main .topTxt p img {
		width: 238px;
	}
	
	#diamond #main .mainBox .imgBox {
		margin-bottom: 90px;
	}
	
	#diamond #main .mainBox .imgBox .textBox {
		width: auto;
	}
	
	#diamond #main .mainBox .imgBox .textBox h3 {
		margin: 0 0 28px;
		text-align: left;
	}
	
	#diamond #main .mainBox .imgBox .textBox p {
		margin-bottom: 25px;
		font-size: 12px;
		line-height: 1.9;
	}
	
	#diamond #main .mainBox .imgBox .photoBox {
		margin: 35px 0 0;
		text-align: center;
	}

	#diamond #main .mainBox .imgBox .photoBox img {
		width: 220px;
	}

	#diamond #main .mainBox .imgBoxR .photoBox {
		margin-top: 27px;
	}

	#diamond #main .mainBox .imgBoxR .photoBox img {
		width: 243px;
	}

	#diamond #main .mainBox .imgBoxR .textBox h3 {
		text-align: center;
	}
	
	#diamond #main .mainBox .imgBoxR .textBox h3 img {
		width: 228px;
	}
	
	#diamond #main .mainBox .txtBox {
		margin-bottom: 80px;
		width: auto;
	}

	#diamond #main .mainBox .txtBox h3 {
		margin: 0 0 30px;
	}
	
	#diamond #main .mainBox .txtBox h3 img {
		width: 208px;
	}

	#diamond #main .mainBox .txtBox .txt01 {
		margin-bottom: 72px;
	}

	#diamond #main .mainBox .txtBox .photo {
		margin: 0 -15px;
	}

	#diamond #main .mainBox .txtBox .photo img {
		width: 100%;
	}

	#diamond #main .mainBox .txtBox .txtDl dt {
		margin: 25px 0 10px;
	}

	#diamond #main .mainBox .txtBox .txtDl dt img {
		width: 138px;
	}

	#diamond #main .mainBox .txtBox .txtDl dd {
		padding-bottom: 15px;
		font-size: 11px;
		line-height: 1.8;
		border-bottom: 1px solid #CCC;
	}

	#diamond #main .mainBox .txtBox .txtDl dd:last-child {
		border-bottom: none;
	}
	
	#diamond #main .mainBox .btmInner {
		padding: 65px 0;
		border-top: 4px solid #E4007F;
		border-bottom: 4px solid #E4007F;
	}

	#diamond #main .mainBox .btmInner h3 {
		margin: 0;
		text-align: center;
	}

	#diamond #main .mainBox .btmInner h3 img {
		width: 165px;
	}

}