@charset "shift_jis";

/**
 * movie配下用
 */


/* ==========================================================================
   ベース
   ========================================================================== */
#topic {
	background-color: #f2f3f5;
	border-top: 1px solid #d7d8d8;
	margin-bottom: 26px;
	padding-bottom: 11px;
	padding-top: 11px;
	font-size: 135%;
}
#topic span {
	display: block;
	width: 640px;
	margin: 0 auto;
}
#topic span.wrap {
	text-align: center;
}
#topic span.wrap .inner {
	display: inline-block;
	text-align: left;
}
#closebtn-wrap {
	margin-top: 30px;
	background-color: #064d87;
}
#closebtn-toggle {
	margin: 0 auto;
	width: 980px;
	position: relative;
	min-height: 45px;
	height: auto !important;
	height: 45px;
}
#btn-close {
	position: absolute;
	top: 0;
	left: 0;
}
#movieArea {
	padding-top: 15px;
	padding-bottom: 30px;
}
div.reset .alignCenter {
	text-align: center !important;
}
div#sectionWrap .grayBox {
	margin: 0 auto;
	width: 600px;
	background-color: #f2f2f2;
	border: 1px solid #d9d9d9;
	padding: 15px 20px;
	line-height: 1.5;
	font-size: 110%;
}
div#sectionWrap .explanatory {
	display: block;
	background-color: transparent;
}


/* ==========================================================================
   レスポンシブレイアウト
   ========================================================================== */


/* 動画
   ========================================================================== */
.rwd-movie-wrap {
	max-width: 640px;
	margin: 0 auto 22px;
}

.rwd-movie-wrap > video {
	width: 100%;
}

@media screen and (max-width: 767px) {
 .rwd-movie-wrap {
		margin-bottom: 27px;
	}
}


/* カラムレイアウト
   ========================================================================== */
.rwd-column-wrap {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	flex-flow: row-reverse nowrap;
}

@media screen and (max-width: 767px) {
 .rwd-column-wrap {
		display: block;
	}
}

/* 2カラム
   =================================== */
.rwd-column-wrap.is-2column > div {
	width: calc((100% - 24px)/2);
}

/* テキスト */
.rwd-column-wrap__text {
	margin-right: 24px;
}

.rwd-column-wrap__text p {
	font-size: 100%;
	line-height: 1.6;
}

.rwd-column-wrap__text p + p {
	margin-top: 11px;
}

/* 画像 */
.rwd-column-wrap__figure > figure {
	margin: 0 auto;
	max-width: 500px;
	width: 100%;
	padding: 0;
}

@media screen and (max-width: 767px) {
	.rwd-column-wrap.is-2column > div {
		width: 100%;
	}

	/* テキスト */
	.rwd-column-wrap__text {
		margin-right: 0;
		width: 100%;
	}

	.rwd-column-wrap__text p {
		font-size: 107.7%; /* 14px */
	}

	.rwd-column-wrap__text p + p {
		margin-top: 9px;
	}

	/* 画像 */
	.rwd-column-wrap__figure {
		margin-bottom: 26px;
	}
}


/* リンク
   ========================================================================== */

/* 矢印付きリンク
   =================================== */
.arrow-link {
	color: #0068b7;
}

.arrow-link:before {
	content: '';
	display: inline-block;
	width: 7px;
	height: 11px;
	background-image: url(/safety/cooperation/activity/movie/img/arrow_right.png);
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: 7px auto;
	background-size: 7px auto;
	margin-right: 14px;
}

.arrow-link:hover {
	color: #0068b7;
	text-decoration: underline;
}
.arrow-link:visited {
	color: #0068b7;
}


/* テキスト
   ========================================================================== */

.rwd-comment-box {
	margin-top: 30px;
	background-color: #f2f2f2;
	border: 1px solid #d9d9d9;
	text-align: center;
	padding: 10px 16px 9px;
}

.rwd-comment-box p {
	font-size: 92.857%; /* 13px */
	line-height: 1.723;
}

@media screen and (max-width: 767px) {
	.rwd-comment-box {
		margin-top: 20px;
		text-align: left;
		padding: 16px 20px;
	}

	.rwd-comment-box p {
		font-size: 100%;
	}
}