@charset "utf-8";

:root {
	--acd-color-bg: #f0f0f0;
	--acd-color-text: #362e2f;
}

@media print, screen and (min-width : 769px){
	#contents_area {
		margin-top: 121px;
		padding-top: 0;
		background: var(--acd-color-bg);
		color: var(--acd-color-text);
	}

	.section {
		position: relative;
		z-index: 1;
	}
	.section img {
		display: block;
		max-width: 100%;
	}
	.section h3 {
		text-align: center;
		letter-spacing: .07em;
		font-size: 32px;
	}
	.section h3 span {
		display: inline-block;
		box-sizing: border-box;
		padding: 0 .5em 16px;
		border-bottom: 1px solid;
	}

	.section .anc {
		position: absolute;
	}

	.section .box_flex {
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: flex-start;
	}

	.section .movie {
		position: relative;
		z-index: 1;
		padding-top: 56.25%;
	}
	.section .movie iframe {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}

	.section .modal_mov_open img {
		display: block;
		width: 100%;
	}


/* ----------------------------------------
	Animation
---------------------------------------- */

	.anim_ready .scroll_anim:not([data-anim-parent*='pc']),
	.anim_ready [data-anim-children*='pc'] {
		opacity: 0;
		backface-visibility: hidden;
		transform: translate(0,40px);
	}

	.anim_ready .anim_end:not([data-anim-parent*='pc']),
	.anim_ready .anim_end [data-anim-children*='pc'] {
		opacity: 1 !important;
		transform: translate(0,0) !important;
		transition-duration: .75s;
		transition-property: opacity, transform;
	}

	.anim_end[data-anim-order^='2'],
	.anim_end [data-anim-order^='2'] { transition-delay: .2s; }
	.anim_end[data-anim-order^='3'],
	.anim_end [data-anim-order^='3'] { transition-delay: .4s; }
	.anim_end[data-anim-order^='4'],
	.anim_end [data-anim-order^='4'] { transition-delay: .6s; }


/* ----------------------------------------
	section_kv
---------------------------------------- */

	#kv_sound,
	#kv_restart {
		position: absolute;
		bottom: 80px;
		z-index: 1;
		width: 42px;
		height: 42px;
		cursor: pointer;
	}
	#kv_sound {
		right: 40px;
		background: url(../img/ico_audio_on.png) 50% 50% / contain no-repeat;
	}

	#kv_sound.on {
		background-image:url(../img/ico_audio_off.png);
	}

	#kv_restart {
		right: 102px;
		border: 1px solid #fff;
		border-radius: 50%;
	}
	#kv_restart::before,
	#kv_restart::after {
		content: '';
		position: absolute;
		top: 50%;
		z-index: 1;
		transform: translateY(-50%);
	}
	#kv_restart::before {
		left: 10px;
		width: 2px;
		height: 20px;
		background: #fff;
	}
	#kv_restart::after {
		right: 10px;
		border: solid transparent;
		border-width: 10px 18px;
		border-right-color: #fff;
	}


/* ----------------------------------------
	section_title
---------------------------------------- */

	#section_title {
		padding: 200px 0 240px;
		text-align: center;
		letter-spacing: .05em;
		color: var(--acd-color-text);
		font-size: 24px;
		background: #f4f4f4;
	}

	#section_title .movie_area {
		width: 800px;
		margin: 90px auto 0;
	}


/* ----------------------------------------
	section_style
---------------------------------------- */

	.section_style {
		padding-bottom: 230px;
		background: 50% 100% / 100% no-repeat;
	}

	#section_sports {
		background-image: url(../img/sportsline_bg_pc.jpg);
		background-color: #000;
		color: #fff;
	}

	#section_touring {
		background-image: url(../img/touringline_bg_pc.jpg);
		background-color: #d7dddd;
		color: #000;
	}

	.style_header {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		height: 100vh;
		max-height: 700px;
		text-align: center;
		background: 50% 100% / cover;
	}

	#section_sports .style_header {
		background-image: url(../img/sportsline_title_bg.jpg);
	}

	#section_touring .style_header {
		background-image: url(../img/touringline_title_bg.jpg);
	}

	.section_style h3 img {
		margin: auto;
	}
	.section_style h3+p {
		margin-top: 35px;
		letter-spacing: .05em;
		font-size: 16px;
	}

	.style_car img {
		width: 100%;
	}

	.equipment_list {
		margin-top: 190px;
	}
	.equipment_list li {
		width: 474px;
	}
	.equipment_list li:nth-child(2n) {
		margin-top: 25px;
	}
	.equipment_list li:nth-child(2) {
		margin-top: 160px;
	}
	.equipment_list li:nth-child(2n+1):not(:first-child) {
		margin-top: -135px;
	}
	.equipment_list li p {
		padding: 5px 10px;
		font-size: 14px;
		line-height: 20px;
	}

	#section_sports .equipment_list li p {
		background: #000;
	}

	#section_touring .equipment_list li p {
		background: #c9d6d8;
	}

	.section_style .movie_area {
		margin-top: 190px;
	}


/* ----------------------------------------
	section_illumination
---------------------------------------- */

	#section_illumination {
		margin-top: 160px;
	}
	#section_illumination h3 span {
		min-width: 436px;
	}

	#section_illumination .movie_area {
		width: 800px;
		margin: 90px auto 0;
	}


/* ----------------------------------------
	section_items
---------------------------------------- */

	#section_items {
		margin-top: 190px;
	}
	#section_items h3 span {
		min-width: 227px;
	}

	#section_items .block_inner {
		width: 1002px;
	}

	#section_items .item_list {
		margin: 90px auto -50px;
	}
	#section_items .item_list li {
		width: 476px;
		margin-bottom: 50px;
	}
	#section_items .item_list li>a {
		display: block;
		overflow: hidden;
	}
	#section_items .item_list li img {
		transition: .3s transform;
	}
	#section_items .item_list li:hover img {
		transform: scale(1.05);
	}
	#section_items .item_list a>div {
		align-items: center;
		position: relative;
		padding: 13px 15px;
		background: #fff;
	}
	#section_items .item_list h4 {
		color: var(--acd-color-text);
		font-size: 24px;
	}

	#section_items .item_list .link {
		padding-right: 30px;
		background: url(../img/item_link_arrow.svg) 100% 50% / 5px no-repeat;
		letter-spacing: .07em;
		font-size: 16px;
		line-height: 24px;
	}


/* ----------------------------------------
	cta, footer
---------------------------------------- */

	.cta .box div {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 80%;
		padding: 12px 22px;
		border: 2px solid #0064a1;
		border-bottom-width: 0;
		background: #fff;
	}

	#footer_topic_path {
		margin-top: 160px;
	}

	#contents_area footer {
		margin-bottom: 0;
		padding-bottom: 110px;
		background: #fff;
	}


/* ----------------------------------------
	movie_modal
---------------------------------------- */

	#movie_modal {
		position: fixed;
		text-align: center;
		white-space: nowrap;
	}
	#movie_modal::after,
	#movie_modal_inner {
		display: inline-block;
		vertical-align: middle;
	}
	#movie_modal::after {
		content: '';
		width: 0;
		height: 100%;
	}
	#movie_modal_inner {
		position: relative;
		width: 90%;
		max-width: 800px;
	}
	#movie_modal_data {
		position: relative;
		padding-top: 56.25%;
	}
	#movie_modal_data iframe {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}


/* ----------------------------------------
	for Retina Display
---------------------------------------- */

	@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx){
		#section_sports {
			background-image: url(../img/sportsline_bg_pc@2x.jpg);
		}
	
		#section_touring {
			background-image: url(../img/touringline_bg_pc@2x.jpg);
		}

		#section_sports .style_header {
			background-image: url(../img/sportsline_title_bg@2x.jpg);
		}
	
		#section_touring .style_header {
			background-image: url(../img/touringline_title_bg@2x.jpg);
		}
	}
}