/*================================================================================
FileName: _layout.scss
================================================================================*/
@import url("https://fonts.googleapis.com/earlyaccess/notosansjapanese.css");
@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700");

body {
	font-family: "Noto Sans Japanese", "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Verdana, sans-serif !important;
}
a:hover {
	text-decoration: none !important;
}
@media screen and (min-width: 897px) {
	.linkList01 {
		margin: 0 auto !important;
	}
	.linkList03 {
		margin: 0 auto !important;
	}
	.f-lnavList {
		padding: 32px 0 33px !important;
	}
}
@media screen and (max-width: 896px) {
	.f-lnavList {
		padding: 40px 5.33% !important;
	}
}

/*----------common----------*/

.mAuto {
	margin: auto;
}
.pt5 {
	padding-top: 5px;
}
.pr5 {
	padding-right: 5px;
}
.pb5 {
	padding-bottom: 5px;
}
.pl5 {
	padding-left: 5px;
}
.bdGray {
	border: 1px solid #ccc;
}
.mainVisual .m-txt01, .mainVisual .m-txt02 {
	line-height: 1.8 !important;
}
.fw300 {
	font-weight: 300;
}

.flex5.flexWrap {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.flex5 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
}
.f-lnavList {
	margin-bottom: 0 !important;
}

@media only screen and (min-width: 897px) {
	.flexPcrr {
		flex-direction: row-reverse !important;
	}
    .wPCmax1200 {
        margin: auto;
        max-width: 1200px !important;
    }
	.wPC100 {
		width: 100% !important;
	}
	.wPC90 {
		width: 90% !important;
	}
	.wPC80 {
		width: 80% !important;
	}
	.wPC70 {
		width: 70% !important;
	}
	.wPC60 {
		width: 60% !important;
	}
	.wPC50 {
		width: 50% !important;
	}
	.wPC40 {
		width: 40% !important;
	}
	.wPC30 {
		width: 30% !important;
	}
	.wPC20 {
		width: 20% !important;
	}
	.wPC10 {
		width: 10% !important;
	}
}

@media only screen and (max-width: 896px) {
	.wSP100 {
		width: 100% !important;
	}
	.wSP90 {
		width: 90% !important;
	}
	.wSP80 {
		width: 80% !important;
	}
	.wSP70 {
		width: 70% !important;
	}
	.wSP60 {
		width: 60% !important;
	}
	.wSP50 {
		width: 50% !important;
	}
	.wSP40 {
		width: 40% !important;
	}
	.wSP30 {
		width: 30% !important;
	}
	.wSP20 {
		width: 20% !important;
	}
	.wSP10 {
		width: 10% !important;
	}
}

@keyframes slider-zoomin {
	0% {
		opacity: 0;
/*		transform: scale(1) rotate(0.001deg);*/
	}
	12.5% {
		opacity: 1;
	}
	20% {
		opacity: 1;
	}
	27.5% {
		opacity: 0;
	}
	100% {
		opacity: 0;
/*		transform: scale(1.3) rotate(0.001deg);*/
	}
}

@media only screen and (max-width: 896px) {
}


/*----------top----------*/

.bgStory .ttlStyle02:after {
	background: #fff;
}

@media only screen and (min-width: 897px) {
	.bgStory {
		height: 600px;
		background: url(/ja/strengths/design/img/story_pc.png) no-repeat center center;
		background-size: cover;
	}
}
@media only screen and (max-width: 896px) {
	.bgStory {
		background: #000;
	}
}

@media only screen and (max-width: 896px) {
}


/*----------story----------*/

@media only screen and (min-width: 897px) {
	.story_oled, .story_global-car-audio, .story_cockpit, .story_u-10, .story_stellanova {
		height: 490px;
		background-size: cover;
	}
	.story_oled {
		background: url(/ja/strengths/design/story/img/oled_pc.png) no-repeat center center;
	}
	.story_global-car-audio {
		background: url(/ja/strengths/design/story/img/global-car-audio_pc.png) no-repeat center center;
	}
	.story_cockpit {
		background: url(/ja/strengths/design/story/img/cockpit_pc.png) no-repeat center center;
	}
	.story_u-10 {
		background: url(/ja/strengths/design/story/img/u-10_pc.png) no-repeat center center;
	}
	.story_stellanova {
		background: url(/ja/strengths/design/story/img/stellanova_pc.png) no-repeat center center;
	}
}

@media only screen and (max-width: 896px) {
	.story_oled {
		background: #000;
	}
	.story_cockpit, .story_stellanova {
		background: #fff;
	}
	.story_global-car-audio, .story_u-10 {
		background: #f5f5f5;
	}
}


.main_movie_parent {
    position: relative;
    overflow: hidden;
    display: block;
    width: 100%;
    height: 380px;
}
.main_movie {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 680px;
}
#main_movie {
    position: absolute;
}
.main_movie_fog {
	height: 100%;
	position: absolute;
	width: 100%;/*20200911 oto*/
	top:0;/*20200911 oto*/
}
.main_movie_strat-white {
    position: absolute;
    width: 100%;
    height: 580px;
    background: #fff;
    animation-name: fade1;
    animation-duration: 5s;
    animation-delay: 3s;
    animation-fill-mode: forwards;
}
.main_movie_text01 {
    display: inline-block;
    position: absolute;
    top: 160px;
    left: 10%;
    text-align: center;
    font-size: 18px;
    line-height: 27px;
    letter-spacing: 0.05em;
    color: #000;
    opacity: 0;
    animation-name: fade2;
    animation-duration: 5s;
    /* animation-delay: 3s; */
    animation-fill-mode: forwards;
}
.main_movie_text01 div {
	display: inline-block;
	text-align: left;
}

/*IE11 ハック */
/*
_:-ms-lang(x)::-ms-backdrop, .main_movie {
	width:983px;
}
_:-ms-lang(x)::-ms-backdrop, .main_movie_fog {
	width:983px;
}
*/

/*Edge ハック */
/*
@supports (-ms-ime-align: auto) {
	.main_movie {
		width:983px;
	}
}
@supports (-ms-ime-align: auto) {
	.main_movie_fog {
		width:983px;
	}
}
*/

@keyframes fade1 {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

@keyframes fade2 {
0% {opacity: 0;}
100% {opacity: 1;}
}


/*----------designers----------*/

@media only screen and (min-width: 897px) {
	.designers .boxStyle01 a {
		padding: 0;
	}
	.designers .swiper-button-next, .designers .swiper-button-prev {
		display: none;
	}
}

@media only screen and (max-width: 896px) {
	.designers .boxStyle01 {
		padding: 0 4% 0 !important;
	}
	.designers .fszSP08 {
		font-size: 12px !important;
	}
}



/*----------activities----------*/

@media only screen and (min-width: 897px) {
	.activities_01, .activities_02, .activities_03 {
		height: 460px;
		background-size: cover;
	}
	.activities_01 {
		background: url(/ja/strengths/design/activities/img/01_pc.jpg) no-repeat center center;
	}
	.activities_02 {
		background: url(/ja/strengths/design/activities/img/02_pc.jpg) no-repeat center center;
	}
	.activities_03 {
		background: url(/ja/strengths/design/activities/img/03_pc.jpg) no-repeat center center;
	}
}

.activities01 .bgGradient , .activities02 .bgGradient {
	margin: auto;
	background: linear-gradient(to bottom,  #fafafa 0%,#f1f1f1 100%);
}
.activities02 .disc {
	margin: auto !important;
}

/*----------works----------*/

@media only screen and (max-width: 896px) {

}

.bgGray05 {
	background: #6c6c6c;
}

.bx-wrapper {
	margin-bottom: 0 !important;
	background: none !important;
	box-shadow: none !important;
	border: none !important;
}

@media only screen and (min-width: 897px) {
	.bg01, .bg02, .bg03, .bg04, .bg05, .bg06 {
		height: 450px;
	}
	.bgTpBlack {
		height: 450px;
		background: rgba(0,0,0,.3);
	}
	.bgTpWhite {
		height: 450px;
		background: rgba(255,255,255,.3);
	}
	.capLeft {
		margin: auto;
		margin-right: 0;
		width: 600px;
	}

	.cybernavi_19 .bg01 {
		background: url(/ja/strengths/design/works/19cybernavi/img/01_pc.png) no-repeat center center;
	}
	.cybernavi_19 .bg02 {
		background: url(/ja/strengths/design/works/19cybernavi/img/02_pc.png) no-repeat center center;
	}
	.cybernavi_19 .bg03 {
		background: url(/ja/strengths/design/works/19cybernavi/img/03_pc.png) no-repeat center center;
	}

	.rakunavi_19 .bg01 {
		background: url(/ja/strengths/design/works/19rakunavi/img/01_pc.png) no-repeat center center;
	}
	.rakunavi_19 .bg02 {
		background: url(/ja/strengths/design/works/19rakunavi/img/02_pc.png) no-repeat 70% center;
	}

	.ts-wx300ta .bg01 {
		background: url(/ja/strengths/design/works/ts-wx300ta/img/01_pc.jpg) no-repeat center center;
	}
	.ts-wx300ta .bg02 {
		background: url(/ja/strengths/design/works/ts-wx300ta/img/02_pc.jpg) no-repeat center center;
	}
	.ts-wx300ta .bg03 {
		background: url(/ja/strengths/design/works/ts-wx300ta/img/03_pc.jpg) no-repeat center center;
	}

	.avh-200ex_a205bt .bg01 {
		background: url(/ja/strengths/design/works/avh-200ex_a205bt/img/01.png) no-repeat;
		background-position: calc(50% - 300px) 20px;
		background-size: 600px auto;
	}
	.avh-200ex_a205bt .bg02 {
		background: url(/ja/strengths/design/works/avh-200ex_a205bt/img/02_pc.png) no-repeat center center;
	}

	.ts-1601in_ts-c601in .bg01 {
		background: url(/ja/strengths/design/works/ts-1601in_ts-c601in/img/01.jpg) no-repeat;
		background-position: calc(50% - 300px) 40px;
		background-size: 580px auto;
	}
	.ts-1601in_ts-c601in .bg02 {
		background: url(/ja/strengths/design/works/ts-1601in_ts-c601in/img/02.jpg) no-repeat;
		background-position: calc(50% + 320px) -190px;
		background-size: 1450px auto;
	}
	.ts-1601in_ts-c601in .bg03 {
		background: url(/ja/strengths/design/works/ts-1601in_ts-c601in/img/03.jpg) no-repeat;
		background-position: calc(50% - 350px) 50px;
		background-size: 750px auto;
	}

	.fh-9300dvs .bg01 {
		background: url(/ja/strengths/design/works/fh-9300dvs/img/01_pc.png) no-repeat center center;
	}

	.deh-5300_4300 .bg01 {
		background: url(/ja/strengths/design/works/deh-5300_4300/img/01.jpg) no-repeat;
		background-position: calc(50% - 330px) 20px;
	}
	.deh-5300_4300 .bg02 {
		background: url(/ja/strengths/design/works/deh-5300_4300/img/02_pc.jpg) no-repeat center center;
	}
/*
	.deh-5300_4300 .bg03 {
		background: url(/ja/strengths/design/works/deh-5300_4300/img/03_pc.jpg) no-repeat center center;
	}
*/

	.cybernavi10_16 .bg01 {
		background: url(/ja/strengths/design/works/16cybernavi10/img/01_pc.jpg) no-repeat center center;
	}

	.cybernavi7_16 .bg01 {
		background: url(/ja/strengths/design/works/16cybernavi7/img/01_pc.jpg) no-repeat center center;
	}

	.ts-a6986r .bg01 {
		background: url(/ja/strengths/design/works/ts-a6986r/img/01_pc.jpg) no-repeat center center;
	}
	.ts-a6986r .bg02 {
		background: url(/ja/strengths/design/works/ts-a6986r/img/02_pc.jpg) no-repeat right center;
	}
	.ts-a6986r .bg03 {
		background: url(/ja/strengths/design/works/ts-a6986r/img/03_pc.jpg) no-repeat center center;
	}

	.sph-da120 .bg01 {
		background: url(/ja/strengths/design/works/sph-da120/img/01_pc.jpg) no-repeat center center;
	}
	.sph-da120 .bg02 {
		background: url(/ja/strengths/design/works/sph-da120/img/02_pc.jpg) no-repeat center center;
	}

	.u-10 .bg01 {
		background: url(/ja/strengths/design/works/u-10/img/01_pc.jpg) no-repeat center center;
	}
	.u-10 .bg02 {
		background: url(/ja/strengths/design/works/u-10/img/02_pc.jpg) no-repeat center center;
	}
	.u-10 .bg03 {
		background: url(/ja/strengths/design/works/u-10/img/03_pc.jpg) no-repeat left center;
	}

	.aps-s301j .bg02 {
		height: 400px;
	}

	.ole-b01 .bg01 {
		background: url(/ja/strengths/design/works/ole-b01/img/01_pc.jpg) no-repeat center center;
	}
	.ole-b01 .bg02 {
		background: url(/ja/strengths/design/works/ole-b01/img/02_pc.jpg) no-repeat center center;
	}
	.ole-b01 .bg03 {
		background: url(/ja/strengths/design/works/ole-b01/img/03_pc.jpg) no-repeat center center;
	}

	.ddj-wego4 .bg01 {
		background: url(/ja/strengths/design/works/ddj-wego4/img/01_pc.jpg) no-repeat center center;
	}

	.toraiz-sp-16 .bg02 {
		background: url(/ja/strengths/design/works/toraiz-sp-16/img/02_pc.png) no-repeat center center;
	}

	.rm-05_rm-07 .bg02 {
		background: url(/ja/strengths/design/works/rm-05_rm-07/img/02_pc.jpg) no-repeat left center;
	}
	.rm-05_rm-07 .bg03 {
		background: url(/ja/strengths/design/works/rm-05_rm-07/img/04_pc.jpg) no-repeat center center;
	}

/*archive*/
	.ts-sw3002s4 .bg01 {
		background: url(/ja/strengths/design/works/ts-sw3002s4/img/01_pc.jpg) no-repeat center center;
	}
	.ts-sw3002s4 .bg02 {
		background: url(/ja/strengths/design/works/ts-sw3002s4/img/02_pc.jpg) no-repeat center center;
	}
	.ts-sw3002s4 .bg03 {
		background: url(/ja/strengths/design/works/ts-sw3002s4/img/03_pc.jpg) no-repeat center center;
	}
	.avic-hrz099 .bg01 {
		background: url(/ja/strengths/design/works/img/avic-hrz099_01_pc.jpg) no-repeat center center;
	}
	.avic-t20 .bg01 {
		background: url(/ja/strengths/design/works/img/avic-t20_01_pc.png) no-repeat center center;
	}
	.se-mx9 .bg01 {
		background: url(/ja/strengths/design/works/se-mx9/img/01_pc.jpg) no-repeat center center;
	}
}

@media only screen and (min-width: 897px) and (max-width: 1200px) {
	.rakunavi_19 .bg02 {
		background: url(/ja/strengths/design/works/19rakunavi/img/02_pc_2.png) no-repeat 70% center;
	}
}



@media only screen and (max-width: 896px) {
	.works_list .boxStyle01 {
		padding: 0 4% 0px;
	}
	
	.fh-9300dvs .bgTpBlack {
		background: #343638;
	}
	.ts-a6986r .bg01 {
		background: #cfcec9;
	}
	.ts-a6986r .bg02 {
		background: #f4f4f2;
	}
	.u-10 .bg01 {
		background: #e5e5e5;
	}
	.u-10 .bg02 {
		background: #e4e4e4;
	}
	.u-10 .bg03 {
		background: #f7f7f7;
	}
	.ole-b01 .bg01 {
		background: #e1e1e1;
	}
	.ole-b01 .bg02 {
		background: #f8f8f8;
	}
	.ole-b01 .bg03 {
		background: #dfdfdf;
	}
	.ddj-wego4 .bg01 {
		background: #b0b0b0;
	}
	.ts-sw3002s4 .bg01 {
		background: #cbcac5;
	}
	.ts-sw3002s4 .bg02 {
		background: #a5a4a0;
	}
	.free-me .bg02 {
		background: #c5bfbc;
	}
	.free-me .bg04 {
		background: #d3d4cf;
	}
}


@media only screen and (max-width: 896px) {
	.wrapper1350 {
		margin: 0 auto;
		width: 100%;
		box-sizing: border-box;
	}
}
@media only screen and (min-width: 897px) {
	.wrapper1350 {
		margin: 0 auto;
		width: 1350px;
		box-sizing: border-box;
	}
}

@media only screen and (min-width: 897px) {
.dvancedEssential_top{
	width: 450px;
}
}

@media only screen and (max-width: 896px) {
.dvancedEssential_top{
	width: 80%;
}
}