/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}



/*
全体共通
v1.0.1
Last Updated: 2020-08-06
*/

/* フォントサイズ初期化 */
html{font-size:62.5%;}
/* ゴシック */
.heisei_kg_300{font-family: heisei-kaku-gothic-std, sans-serif;    font-weight: 300;    font-style: normal;}
.heisei_kg_500{font-family: heisei-kaku-gothic-std, sans-serif;    font-weight: 500;    font-style: normal;}
.heisei_kg_700{font-family: heisei-kaku-gothic-std, sans-serif;    font-weight: 700;    font-style: normal;}
.heisei_kg_900{font-family: heisei-kaku-gothic-std, sans-serif;    font-weight: 900;    font-style: normal;}
/* 明朝 */
.v7mincho_300{font-family: vdl-v7mincho, sans-serif;    font-weight: 300;    font-style: normal;}
.v7mincho_500{font-family: vdl-v7mincho, sans-serif;    font-weight: 500;    font-style: normal;}
.v7mincho_700{font-family: vdl-v7mincho, sans-serif;    font-weight: 700;    font-style: normal;}
.v7mincho_800{font-family: vdl-v7mincho, sans-serif;    font-weight: 800;    font-style: normal;}
.v7mincho_900{font-family: vdl-v7mincho, sans-serif;    font-weight: 900;    font-style: normal;}

/* .fadeinクラスを利用した要素のフェードイン */
.fadein {
	opacity: 0;
	transform : translate(0, 50px);
	transition : all 1000ms;
}

.fadein.scrollin{
	opacity: 1;
	transform: translate(0, 0);
}


/*
header
v1.0.1
Last Updated: 2020-09-07
*/

header{
	position: absolute;
    top:0;
    width: 100%;
	z-index:11;
}
header input{display: none;}
header img{
	max-width:100%;
	max-height:100%;
	width:auto;
	height:auto;
}
header .scroll_following{
    display: none;
    position: sticky;
    width: 100%;
}

header .scroll_following > div{}
header .scroll_following > div > div {
    font-size: 2.0em;
    letter-spacing: .1em;
    text-align: right;
    padding: 1em 1em 0 0;
    color: #c1c1c3;
}
header .scroll_following label
,header .full_screen_head label
{cursor: pointer;}


header .full_screen{
    position: fixed;
    opacity: 1;
    top: 0;
    width: 100%;
    height: auto;
    transition: all 0.6s ease 0s;
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: 50%;
    background-color: #1d1e32; 
    z-index: -999;
    pointer-events:all;

}

header .full_screen.before_follow{
    top:-5em ;
}

header .full_screen_head{display: none;}
header .full_screen_head > div{
	width:calc(100% / 2);
	flex-grow:1;
    font-size: 2.0em;
    letter-spacing: .1em;
	padding:1em 1em 0 1em;
}
header .full_screen_head > div:nth-child(1){
    height: 1em;
    text-align:left;
}
header .full_screen_head > div:nth-child(2){
    color: #c1c1c3;
	text-align:right;
}
header .full_screen_main{}
header .full_screen_main > ul{
    display: flex;
    height: auto;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;

}
header .full_screen_main > ul > li{
    transform: translateY(0);
    opacity: 1;
}
header .full_screen_main a{
    color: #c1c1c3;
    font-size: 1.4em;
    text-decoration: none;
    line-height: 3;
}
header .full_screen_foot{display: none;}

header #menu_toggle:checked ~ .full_screen {
    z-index: 999;
    opacity: 1;
    pointer-events: all;
}
header #menu_toggle:checked ~ .full_screen .full_screen_main > ul > li{
    transform: translateY(0);
    opacity: 1;
}
header #menu_toggle:checked ~ .full_screen .full_screen_main > ul > li:nth-child(1){transition: all 0.9s ease .0s;}
header #menu_toggle:checked ~ .full_screen .full_screen_main > ul > li:nth-child(2){transition: all 0.9s ease .1s;}
header #menu_toggle:checked ~ .full_screen .full_screen_main > ul > li:nth-child(3){transition: all 0.9s ease .2s;}
header #menu_toggle:checked ~ .full_screen .full_screen_main > ul > li:nth-child(4){transition: all 0.9s ease .3s;}
header #menu_toggle:checked ~ .full_screen .full_screen_main > ul > li:nth-child(5){transition: all 0.9s ease .4s;}
header #menu_toggle:checked ~ .full_screen .full_screen_main > ul > li:nth-child(6){transition: all 0.9s ease .5s;}
header #menu_toggle:checked ~ .full_screen .full_screen_main > ul > li:nth-child(7){transition: all 0.9s ease .6s;}

@media screen and (max-width: 767px) {
    header{
        position:sticky;
    }    
    header .full_screen.before_follow{
        top:0em;
    }    
    header .scroll_following{
        display: block;
        position: absolute;
        width: 100%;
    }
    
    header .scroll_following > div > div {
        font-size: 1.6em;
    }
    header .full_screen{
        opacity: 0;
        height: 100vh;
        background-size: 70%;
        pointer-events: none;
        background-image: url(/images/20th_lg.png);
    }
    header .full_screen_head{display: flex;}
    header .full_screen_head > div:nth-child(1){text-align:center;}
    header .full_screen_head > div:nth-child(2){display: none;}
    header .full_screen_main > ul > li{
        opacity: 0;
        transform: translateY(1.4em);
    }    
    header .full_screen_main > ul > li:last-child{display: block;}
    header .full_screen_main > ul{
        display: flex;
        flex-direction:column;
        height: calc(100vh - 20em);
        
    }
    header .full_screen_main a{
        font-size: 1.6em;
        text-decoration: inherit;
        line-height: inherit;
    }
    header .full_screen_foot{
        display: block;
        position: absolute;
        font-size: 1.6em;
        bottom: 9em;
        left: 0;
        right: 0;
        text-align: center;
        color: #c1c1c3;
    }

    .menu_trigger{
      display: inline-block;
      transition: all .4s;
      box-sizing: border-box;
      border-top: 2px solid rgba(200,200,200,.8);
    }
    .menu_trigger::before,
    .menu_trigger::after
    {
        content: "";
        display: inline-block;
        transition: all .4s;
        box-sizing: border-box;
        position: absolute;
        left: 0;
        width: 100%;
        height: 2px;
        background-color: rgba(200,200,200,.8);
    }

    .menu_trigger {
      position: relative;
      width: 1.5em;
      height: 1em;
    }
    .menu_trigger::before {
      top: calc((100% - 2px) / 2);
    }
    .menu_trigger::after {
      top: 100%;
    }
    
}

/*
footer
v1.0.0
Last Updated: 2020-00-00
*/

footer{}
footer img{
    max-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
}
footer .global_footer{
    padding: 2.8em 5.6em 5.6em;
    background-repeat: no-repeat;
    background-size: contain;
    background-position-x: calc(5.6em);
    background-image: url(/images/20th_lg_2.png);
    background-color: #1d1e32;
}
footer .global_footer > div{
    display: flex;
    justify-content: space-between;
}
footer .global_footer > div > div{
    width: calc(100% / 2);
}
footer .mb_logo{
    display: flex;
    align-items: center;
    padding-left: 14em;
}
footer .mb_logo > div{width: 200px;}
footer .global_footer nav > ul {
    margin: auto 7em auto auto ;
    display: flex;
    width: calc(1.4em * 14);
    flex-wrap: wrap;
    flex-direction: column;
    font-size: 1.4em;
    line-height: 3.5em;
    height: calc(3.5em * 4 );
}
footer .global_footer nav > ul > li {
    padding-right: calc(1.4rem * 5);
}
footer .global_footer nav > ul > li > a {
    display: block;
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    color: #c1c1c3;
}

@media screen and (max-width: 767px) {
    footer .global_footer{
        background-size: cover;
        background-position-x: 50%;
        background-image: url(/images/20th_lg_2.png);
    }
    footer .global_footer > div{
        display: block;
    }
    footer .global_footer > div > div{
        width: calc(100%);
    }
    footer .global_footer nav > ul {
        width: calc(100%);
        align-content: space-between;
        line-height: 2.8em;
        height: calc(2.8em * 4 );
    
    }    
    footer .global_footer nav > ul > li {
        padding-right:0;
        width: calc((100% - 1.4em) / 2);
        box-sizing: border-box;
    }
    footer .mb_logo{
        justify-content: center ;
        padding: 4.2em 0;
    }
    footer .mb_logo > div{width: 16em;}

}

/*
採用案内
v1.0.0
Last Updated: 2020-00-00
Author: tsuchimoto
*/

.rec .rec_bg{position:fixed;top:0;left:0;z-index:-10;}
.rec .rec_header{background-color:#1d1e32;color:#FFF;text-align:center;}
.rec .rec_header h2{border:none;line-height:1.5em;}
.rec .rec_box{max-width:1200px;width:100%;margin:0 auto;}
.rec .rec_box .content_01{overflow:hidden;position:relative;margin:2em 0;}
.rec .rec_box .content_01 img{width:100%;float:right;display:block;transition:0.5s all;}
.rec .rec_box .content_01_box{position:absolute;background-color:#1d1e32;text-align:center;padding:70px 50px;right:0;top:50%;transform:translatey(-50%);color:#FFF;}
.rec .zoom_box{overflow:hidden;width:700px;float:left;position: relative;}
.rec .rec_box .content_01 .hoverani:hover{transform:scale(1.1,1.1);transition:0.5s all;}

.rec .rec_box .content_02{overflow:hidden;position:relative;padding-bottom:2em;}
.rec .rec_box .content_02 img{width:100%;float:left;display:block;transition:0.5s all;}
.rec .rec_box .content_02_box{position:absolute;background-color:#1d1e32;text-align:center;padding:70px;right:0;top:50%;transform:translatey(-50%);color:#FFF;}
.rec .zoom_box_02{overflow:hidden;width:700px;float:left;position: relative;}
.rec .rec_box .content_02 .hoverani:hover{transform:scale(1.1,1.1);transition:0.5s all;}

.rec .content_03{overflow:hidden;position:relative;}
.rec .content_03_box{text-align:center;padding:10em 0;margin:0 auto;width:100%;color:#FFF;}
.rec .content_03{background-image:url(recruit/img/main_3.jpg);background-size:100%;background-position:center center;transition:0.5s all;}
.rec .content_03:hover{background-size:110%;transition:0.5s all;}

.rec h2{font-size:2.5em;border-bottom:1px solid;border-top:1px solid;padding:0.5em 0;margin:20px auto;display: inline-block;line-height:1.5em;}
.rec .content_01_txt{margin:20px auto;font-size:1.5em;max-width:600px;margin:0 auto;width:90%;}
.rec .content_01_txt p{margin:2em auto 1em;line-height:1.5em;}
.rec .content_01_txt a{margin:1em auto 2em;font-size:1.2em;color:#40688a;line-height:1.5em;}

.rec .ul_box{max-width:400px;width:calc( 100% - 4em );margin:0 auto;border:1px solid;border:1px solid;padding:1em 1em 1em 3em;display: block;}
.rec .ul_box li{text-align:left;text-indent:1em;margin:0.5em auto;}

.rec .zoom_box span{display: block;width: 100%;height: 100%;background-color: #FFF;position: absolute;}
.rec .zoom_box_02 span{display: block;width: 100%;height: 100%;background-color: #FFF;position: absolute;}

/* 点滅 */
.blinking{
    -webkit-animation:blink 2s ease-in-out infinite alternate;
    -moz-animation:blink 2s ease-in-out infinite alternate;
    animation:blink 2s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0.8;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0.8;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0.8;}
    100% {opacity:1;}
}
@media screen and (max-width: 767px) {
	.rec .rec_header h2{margin-bottom: 0em;width: calc( 90% - 5%);text-align: left;font-size: 2.5em;margin-top: 1em;margin-left: 10%;}
	.rec .zoom_box{float:none;width: 90%;margin: 0 0 0 auto;}
	.rec .rec_box .content_01_box{position:static;transform:none;}
	.rec .rec_box .content_01{padding:0;margin: 0 0 2em;}
	.rec .zoom_box_02{float:none;width: 90%;margin: 0 auto 0 0;}
	.rec .rec_box .content_02_box{position:static;transform:none;}
	.rec .rec_box .content_02{padding-bottom:0;margin: 0 0 2em;}
	.rec , .rec .rec_box{background-color:#1d1e32;}
	.rec .rec_box .content_01_box{padding:3em 0;width:80%;margin:0 5% 0 auto;text-align:right;}
	.rec .rec_box .content_02_box{padding:3em 0;width:80%;margin:0 auto 0 5%;text-align:left;}
	.rec h2{font-size: 2em;margin: 0;width: 100%;text-align: center;}
	.rec .content_03{background-size:100% 100%;background-image:url(img/main_3_sp.jpg);}
	.rec .content_03:hover{background-size:110% 110%;}
	.rec .content_02 h2{margin-left:5%;}
	.rec .content_03_box .content_01_txt{text-align:left;width:80%;margin-bottom:2em;}
	.rec .ul_box li {font-size: 14px;}
}

/*
事業サービス内容
v1.0.0
Last Updated: 2020-00-00
Author: 
*/
.sp {
	display: none;
}
.bus * {
	font-family: heisei-kaku-gothic-std, sans-serif;
	font-weight: 300;
	font-style: normal;
}
.bus .business {
	
}
.bus .business .chart-wrap {
	position: relative;
	background: url('business/image/flow_bg.jpg');
	background-size: cover;
	background-repeat: no-repeat;
}

.bus .business .chart-wrap .chart {
	position: relative;
	margin: 0 auto;
	padding: 200px 0 0;
	width: 1120px;
	
}
.bus .business .chart-wrap .chart h3 {
	position: absolute;
	top: 100px;
	left: 30px;
	color: #FFF;
	font-family: vdl-v7mincho, sans-serif;
	font-size: 2.6em;
	text-align: center;
}
.bus .business .chart-wrap .chart h3 span {
	border-bottom: solid #fff 1px;
	width: 100%;
	padding: 0 0 10px;
	font-family: vdl-v7mincho, sans-serif;
}
.bus .business .chart-wrap .chart h3 p {
	margin: 30px 0 0;
	font-size: 1.2em;
	line-height: 1.4em;
	font-family: vdl-v7mincho, sans-serif;
}
.bus .business .chart-wrap .chart .lists {
	position: absolute;
	top: 0;
	left: 0;
}
.bus .business .chart-wrap .chart .lists li {
	display: block;
	position: absolute;
	top: 200px;
	left: 100px;
	padding: 0 10px;
	color: #fff;
	text-align: center;
	
	font-size: 1.6em;
	line-height: 1.4em;
	
	/*background:red;*/
}


.bus .business .chart-wrap .chart .lists li .tooltip {
	display: none;
	position: absolute;
	z-index: 10;
	padding: 10px 10px;
	background: #fff;
	color: #000;
	text-decoration: none;
	
	transform: translateY(50px);
	/*transition: 1s;*/
	
	width: 600px;
}
.bus .business .chart-wrap .chart .lists li .tooltip .image {
	float: left;
	width: 47%;
}
.bus .business .chart-wrap .chart .lists li .tooltip .image img {
	vertical-align: bottom;
}
.bus .business .chart-wrap .chart .lists li .tooltip .text {
	float: left;
	width: 50%;
	margin: 0 0 0 3%;
}
.bus .business .chart-wrap .chart .lists li .tooltip .text h4 {
	padding: 15px;
	text-decoration: underline;
}
.bus .business .chart-wrap .chart .lists li .tooltip .text .description {
	text-align: left;
	font-size: 0.85em;
	font-weight: normal;
}


.bus .business .chart-wrap .chart .lists li:hover {
	/*font-size: 1.5em;
	line-height: 1.5em;*/
	font-weight: bold;
	transition: 1s;
	color: #314da0;
	cursor: pointer;
}
.bus .business .chart-wrap .chart .lists li span {
	writing-mode: vertical-lr;
	text-orientation: upright;
}
.bus .business .chart-wrap .chart .lists li.item01 {
	top: 520px;
	left: 108px;
	height: 175px;
}
.bus .business .chart-wrap .chart .lists li.item02 {
	top: 532px;
	left: 220px;
	height: 112px;
}
.bus .business .chart-wrap .chart .lists li.item03 {
	top: 494px;
	left: 318px;
	height: 112px;
}
.bus .business .chart-wrap .chart .lists li.item04 {
	top: 421px;
	left: 414px;
	height: 150px;
}
.bus .business .chart-wrap .chart .lists li.item05 {
	top: 413px;
	left: 510px;
	height: 112px;
}
.bus .business .chart-wrap .chart .lists li.item06 {
	top: 296px;
	left: 609px;
	height: 190px;
}
.bus .business .chart-wrap .chart .lists li.item07 {
	top: 335px;
	left: 702px;
	height: 125px;
}
.bus .business .chart-wrap .chart .lists li.item08 {
	top: 258px;
	left: 797px;
	height: 156px;
}
.bus .business .chart-wrap .chart .lists li.item09 {
	top: 260px;
	left: 894px;
	height: 112px;
}
.bus .business .chart-wrap .chart .lists li.item10 {
	top: 223px;
	left: 990px;
	height: 112px;
}
.bus .business .chart-wrap .chart img {
	width: 100%;
}

.bus .business .lead {
	background: #121f32;
}
.bus .business .lead.bottom {
	background: url('business/image/business_bottom_bg.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	padding: 120px 0;
	
}
.bus .business .lead .text {
	padding: 50px 0;
	color: #FFF;
	text-align: center;
	font-size: 2.8em;
	line-height: 1.8em;
	font-family: vdl-v7mincho, sans-serif;
}

.bus .business .stragegy {
	width: 900px;
	margin: 0 auto;
}
.bus .business .stragegy .cont {
	margin: 0 0 100px;
}
.bus .business .stragegy .cont h4 {
	text-align: center;
	position: relative;
}
.bus .business .stragegy .cont h4 img {
	width: 170px;
}
.bus .business .stragegy .cont .wrap {
	overflow: hidden;
	position: relative;
	margin: -35px 0 0;
	padding: 30px 50px 20px;
}
.bus .business .stragegy .cont .wrap:after {
	position: absolute;
	content: "";
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	
	width: 5px;
	height: 100%;
	background: #dedede;
	z-index: -1;
}
.bus .business .stragegy .cont .wrap .left {
	float: left;
	position: relative;
	width: 40%;
}
.bus .business .stragegy .cont .wrap .left img {
	width: 100%;
}
.bus .business .stragegy .cont .wrap .arrow {
	float: left;
	position: relative;
	width: 20%;
	margin: 17% 0 0;
	z-index: 1;
}
.bus .business .stragegy .cont .wrap .arrow img {
	width: 100%;
}
.bus .business .stragegy .cont .wrap .right {
	float: right;
	position: relative;
	width: 40%;
	margin: 10% 0 0;
}
.bus .business .stragegy .cont .wrap .right img {
	width: 100%;
}
.bus .business .stragegy .cont .wrap span {
	position: absolute;
	font-family: vdl-v7mincho, sans-serif;
	font-size: 1.6em;
	line-height: 1.4em;
}
.bus .business .stragegy .cont .wrap .left span {
	top: 80px;
	left: -50px;
	background: #FFF;
	padding: 10px 10px;
	
}
.bus .business .stragegy .cont .wrap .right span {
	bottom: 50px;
	right: -50px;
	background: #121f32;
	color: #FFF;
	padding: 10px 10px;
	font-style: italic;
}
.bus .business .stragegy .cont .stitle {
	margin: 30px 0 0;
	text-align: center;
	font-size: 2.4em;
	line-height: 1.4em;
	font-family: vdl-v7mincho, sans-serif;
}
.bus .business .stragegy .cont .text {
	margin: 30px 0 0;
	text-align: center;
	font-size: 1.4em;
	line-height: 1.6em;
}

.bus .reason {
	width: 900px;
	margin: 70px auto 100px;
}
.bus .reason h3 {
	text-align: center;
}
.bus .reason h3 span {
	border-bottom: solid 1px #ccc;
	padding: 0 0 10px;
	font-size: 2.8em;
	line-height: 1em;
	font-family: vdl-v7mincho, sans-serif;
}
.bus .reason ul {
	list-style: none;
	overflow: hidden;
}
.bus .reason ul li {
	float: left;
	list-style: none;
	width: 32%;
	margin: 70px 2% 0 0;
	text-align: center;
	font-size: 1.2em;
}
.bus .reason ul li img {
	width: 40%;
	display: block;
	margin: 0 auto 20px;
}
.bus .reason ul li span {
	display: block;
	font-size: 1.4em;
	font-weight: bold;
	margin: 0 0 20px;
}
.bus .reason ul li a {
	display: block;
	margin: 10px 0 0;
	color: #4274b9;
}
.bus .reason ul li a:link,
.bus .reason ul li a:visited,
.bus .reason ul li a:hover,
.bus .reason ul li a:active {
	text-decoration: none;
}
.bus .reason ul li:nth-child(3n) {
	margin: 70px 0 0 0;
}
@media screen and (max-width: 767px) {
	.sp {
		display: block;
	}
	.pc {
		display: none;
	}
	.bus {
	}
	.bus .business {
		
	}
	.bus .business .chart-wrap {
		position: relative;
		background: url('business/image/flow_bg_sp.jpg');
		background-size: cover;
		background-repeat: no-repeat;
	}
	
	.bus .business .chart-wrap .chart {
		/*position: relative;
		margin: 0 auto;*/
		padding: 0;
		width: auto;
		
	}
	.bus .business .chart-wrap .chart h3 {
		position: relative;
		top: 0;
		left: 0;
		/*color: #FFF;*/
		font-size: 1.8em;
		/*text-align: center;*/
		width: 100%;
	}
	.bus .business .chart-wrap .chart h3 .bg {
		background: #121f32;
		padding: 80px 0 50px;
	}
	.bus .business .chart-wrap .chart h3 .bg span {
		border-bottom: solid #fff 1px;
		/*font-family: vdl-v7mincho, sans-serif;*/
	}
	.bus .business .chart-wrap .chart h3 p {
		/*font-family: vdl-v7mincho, sans-serif;*/
	}
	.bus .business .chart-wrap .chart .slick-wrap {
		margin: 0 15px;
		padding: 50px 0;
	}
	
	.bus .business .chart-wrap .chart .slick-wrap .slider-for .slick-slide {
		display: block;
		background: #fff;
		padding: 10px 10px 15px;
		overflow: hidden;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-for .slick-slide h4 {
		padding: 10px 0 20px;
		text-decoration: underline;
		text-align: center;
		font-size: 1.3em;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-for .slick-slide .image {
		float: left;
		width: 47%;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-for .slick-slide .text {
		float: left;
		width: 50%;
		margin: 0 0 0 3%;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-for .slick-slide .text .description {
		text-align: left;
		font-size: 1.1em;
		font-weight: normal;
		line-height: 1.3em;
	}
	
	
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav {
		margin: 50px 0 0;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide {
		text-align: center;
		height: 140px;
		width: 120px !important;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide {
		background: url('business/image/rbn_sp.png');
		background-repeat: no-repeat;
		position: relative;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.slick-current {
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.slick-current .pin img {
		width: 25px;
		transition: .5s;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.slick-current .label {
		font-size: 1.6em;
		font-weight: bold;
		transition: .5s;
		color: #314da0;
		text-shadow: 1px 1px 2px #000;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav01 {
		background-position: bottom 0 left 0;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav01 .label::after {
		right: -13px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav02 {
		background-position: bottom 0 left -100px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav02 .label::after {
		right: -5px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav03 {
		background-position: bottom 0 left -200px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav04 {
		background-position: bottom 0 left -300px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav04 .label::after {
		right: -5px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav05 {
		background-position: bottom 0 left -400px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav05 .label::after {
		right: 8px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav06 {
		background-position: bottom 0 left -500px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav06 .label::after {
		right: -15px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav07 {
		background-position: bottom 0 left -600px;
	}
	
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav08 {
		background-position: bottom 0 left -700px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav08 .label::after {
		right: -15px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav09 {
		background-position: bottom 0 left -800px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav09 .label::after {
		right: -10px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav10 {
		background-position: bottom 0 left -900px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide.nav10 .label::after {
		content: '';
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide .label {
		font-size: 1.2em;
		line-height: 1.2;
		color: #fff;
	}
	
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide .label::after {
		content: '>';
		position: absolute;
		right: 0px;
		top: 0px;
		color: #fff;
		font-weight: normal;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide .pin {
		position: absolute;
		bottom: 0;
		width: 100%;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-slide .pin img {
		margin: 0 auto 40px;
		width: 18px;
	}
	
	.bus .business .chart-wrap .chart .slick-wrap .slider-for .slick-arrow {
		color: #fff;
		font-weight: bold;
		font-size: 18px;
		position: absolute;
		top: 48%;
		z-index: 100;
		background: #333;
		border-radius: 50%;
		padding: 4px 6px 6px 7px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-for .slick-arrow.prev {
		left: -12px;
		
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-for .slick-arrow.next {
		right: -12px;
	}
	
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-arrow {
		color: #fff;
		font-weight: bold;
		font-size: 14px;
		position: absolute;
		bottom: 18%;
		z-index: 100;
		
		background: #333;
		padding: 8px 5px 10px;
		border-radius: 3px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-arrow.prev {
		left: -7px;
	}
	.bus .business .chart-wrap .chart .slick-wrap .slider-nav .slick-arrow.next {
		right: -7px;
	}
	
	
	
	.bus .business .chart-wrap .chart .slick-wrap .slick-disabled {
		display: none !important;
	}
	
	.bus .business .chart-wrap .chart img {
		width: 100%;
	}
	
	.bus .business .lead {
		background: #121f32;
	}
	.bus .business .lead.bottom {
		background: url('business/image/business_bottom_bg_sp.jpg');
		background-size: cover;
		background-repeat: no-repeat;
		padding: 120px 0;
		
	}
	.bus .business .lead .text {
		padding: 20px 0;
		/*color: #FFF;
		text-align: center;*/
		font-size: 1.8em;
		line-height: 1.4em;
		/*font-family: vdl-v7mincho, sans-serif;*/
	}
	.bus .business .lead.bottom .text {
		margin: 0 15%;
		line-height: 3em;
		font-size: 1.6em;
	}
	
	.bus .business .stragegy {
		width: auto;
		/*margin: 0 auto;*/
	}
	.bus .business .stragegy .cont {
		margin: 0 0 30px;
	}
	.bus .business .stragegy .cont h4 {
		/*text-align: center;*/
	}
	.bus .business .stragegy .cont h4 img {
		width: 165px;
	}
	.bus .business .stragegy .cont .wrap {
		overflow: hidden;
		position: relative;
		margin: -35px 0 0;
		padding: 40px 10px 30px;
	}
	.bus .business .stragegy .cont .wrap:after {
		position: absolute;
		content: "";
		top: 0;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		
		width: 5px;
		height: 100%;
		background: #dedede;
		z-index: -1;
	}
	.bus .business .stragegy .cont .wrap .left {
		float: left;
		position: relative;
		width: 70%;
	}
	.bus .business .stragegy .cont .wrap .left .arrow-sp {
		float: none;
		position: absolute;
		width: 30px;
		margin: 0;
		padding: 0;
		right: -30px;
		bottom: -20px;
		left: auto;
		
	}
	.bus .business .stragegy .cont .wrap .left img {
		width: 100%;
	}
	.bus .business .stragegy .cont .wrap .arrow img {
		width: 100%;
	}
	.bus .business .stragegy .cont .wrap .right {
		float: right;
		position: relative;
		width: 70%;
		margin: 7% 0 0;
	}
	.bus .business .stragegy .cont .wrap .right img {
		width: 100%;
	}
	.bus .business .stragegy .cont .wrap span {
		/*position: absolute;
		font-family: vdl-v7mincho, sans-serif;*/
		font-size: 1.2em;
		line-height: 1.4em;
	}
	.bus .business .stragegy .cont .wrap .left span {
		top: 60px;
		left: -10px;
		/*background: #FFF;
		padding: 10px 10px;*/
		
	}
	.bus .business .stragegy .cont .wrap .right span {
		bottom: 50px;
		right: -10px;
		/*background: #121f32;
		color: #FFF;
		padding: 10px 10px;
		font-style: italic;*/
	}
	.bus .business .stragegy .cont .stitle {
		margin: 10px 0 0;
		/*text-align: center;*/
		font-size: 1.8em;
		/*line-height: 1.4em;
		font-family: vdl-v7mincho, sans-serif;*/
	}
	.bus .business .stragegy .cont .text {
		margin: 20px 10px 0;
		text-align: center;
		font-size: 1.2em;
		line-height: 1.4em;
	}
	
	.bus .reason {
		width: auto;
		margin: 70px 10px 100px;
	}
	.bus .reason h3 {
		text-align: center;
	}
	.bus .reason h3 span {
		border-bottom: solid 1px #ccc;
		padding: 0 0 10px;
		font-size: 2em;
		line-height: 1em;
		/*font-family: vdl-v7mincho, sans-serif;*/
	}
	.bus .reason ul {
		list-style: none;
		overflow: hidden;
	}
	.bus .reason ul li {
		float: left;
		list-style: none;
		width: 100%;
		margin: 70px 20px 0 0;
		text-align: center;
		font-size: 1.2em;
	}
	.bus .reason ul li img {
		width: 30%;
		display: block;
		margin: 0 auto 20px;
	}
	.bus .reason ul li span {
		display: block;
		font-size: 1.4em;
		font-weight: bold;
		margin: 0 0 20px;
	}
	.bus .reason ul li a {
		display: block;
		margin: 10px 0 0;
		color: #4274b9;
	}
	.bus .reason ul li a:link,
	.bus .reason ul li a:visited,
	.bus .reason ul li a:hover,
	.bus .reason ul li a:active {
		text-decoration: none;
	}
}



/*
沿革
v1.0.0
Last Updated: 2020-00-00
Author: 
*/
.his {
	margin: 0 0 70px;
}
.his input {
	display: none;
}
.his h1 {
	background: #1d1e32;
	text-align: center;
	padding: 4.8em;
	/*margin: 0 0 6.4em;*/
	margin: 0 0 0;
}
.his h1 span {
	color: #fff;
	display: block;
	font-family: vdl-v7mincho, sans-serif;
}
.his h1 span.main {
	font-size: 4.2em;
	margin: 0 0 1.6rem;
}
.his h1 span.sub {
	font-size: 1.6em;
}

/* ********** 理念　パーツ ********* */
.his .idx_rinen > div{
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
}
.his .idx_rinen > div::before{
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(images/philosophy_k.jpg) ;
}

.his .idx_rinen > div > div{
    width: 660px;
    line-height: 1.5;
    position: relative;
    margin: auto 0 auto auto;
    right: 4%;
    color: #eee;
}
.his .idx_rinen h2{
    padding-top: 1em;
    font-size: 3.2em;
}
.his .idx_rinen h3{font-size: 1.8em;line-height: 2;}
.his .idx_rinen hr{margin: .5em 0;}
.his .idx_rinen h3 label{cursor: pointer;position: relative;}
.his .idx_rinen h3 label span{
    position: relative;
    top: -1px;
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-left: .5em;
    border: 1px solid #fff;
    box-sizing: border-box;
    vertical-align: middle;
}
.his .idx_rinen h3 label span::after{
    content: "＋";
    position: absolute;
    top: -0.4em;
    left: -1px;
    font-size: .85em;
    transform: rotate(0deg);
}
.his .idx_rinen p{
    overflow: hidden;
    font-size: 1.4em;
    line-height: 1.6;
    padding: 1em 0;
}
.his .idx_rinen p > span{display: block;}
.rinen1,
.rinen2,
.rinen3,
.rinen4
{
    transition: all .0s;
    height: 0;
    transform: translateY(-1em);
    opacity: 0;
}

#rinen1:checked ~ div.rinen1,
#rinen2:checked ~ div.rinen2,
#rinen3:checked ~ div.rinen3,
#rinen4:checked ~ div.rinen4
{
    transition: all .9s ease 0s;
    opacity: 1;
    transform: translateY(0em);
    height: auto;
}

#rinen1:checked ~ div label[for="rinen1"] span::after,
#rinen2:checked ~ div label[for="rinen2"] span::after,
#rinen3:checked ~ div label[for="rinen3"] span::after,
#rinen4:checked ~ div label[for="rinen4"] span::after
{
    top: -3px;
    left: -2px;
    transition: all .3s;
    transform: rotate(135deg);
    line-height: 1.2;
}

.his .outline table {
	width: 900px;
	margin: 6.4em auto 0;
}
.his .outline table tr {
	border-bottom: 1px solid #eee;
}

.his .outline table tr th {
	padding: 1.6em 0;
	font-size: 1.4em;
	line-height: 1.6em;
	width: 20%;
	text-align: left;
	vertical-align: middle;
}
.his .outline table tr td {
	padding: 1.6em 0;
	font-size: 1.4em;
	line-height: 1.6em;
	width: 80%;
	vertical-align: middle;
}
.his .outline table tr td dl dt {
	float: left;
	width: 15%;
	padding: 5px 0 0;
}
.his .outline table tr td dl dd {
	float: left;
	width: 85%;
	padding: 5px 0 0;
}
.his .award {
	width: 1000px;
	margin: 70px auto 0;
}
.his .award h3 {
	font-size: 30px;
	text-align: center;
}
.his .award ul {
	list-style: none;
	overflow: hidden;
	flex-wrap: wrap;
    display: flex;
}
.his .award ul li {
	/*float: left;*/
	width: 24%;
	background: #0c0c0e;
	margin: 2% 1.33% 0 0;
	padding: 1em 0;
}
.his .award ul li:nth-child(4n) {
	margin: 2% 0 0 0;
}
.his .award ul li img {
	width: 100%;
}
.his .award ul li span {
	display: inline-block;
	width: 100%;
	color: #FFF;
	text-align: center;
	font-size: 1.2em;
	line-height: 1.6em;
	margin: 1em 0;
}
.his .warehouse{max-width:737px;width:100%;margin:5em auto;}
.his .warehouse img{width:100%;}
@media screen and (max-width: 767px) {
	.his {
		margin: 0 0 70px;
		/*background: red;*/
	}
	
	/* ********** 理念　パーツ ********* */
    .his .idx_rinen > div::before{
        background-image: url(images/philosophy_k_sp.jpg) ;
    }
    
    .his .idx_rinen > div > div{
        width: 100%;
        margin: auto 0 auto auto;
        right: 0;
        padding: 0 1em;
    }
    .his .idx_rinen h2{padding-top: 1em;}
    .his .idx_rinen p > span{display: inline;}
	
	.his .outline {
		width: auto;
		margin: 5em 20px;
	}
	.his .outline table {
		width: auto;
		margin: 0 auto;
	}
	.his .outline table tr {
		border-bottom: 1px solid #eee;
	}
	.his .outline table tr th {
		padding: .5em 0;
		font-size: 1.3em;
		line-height: 1.4em;
		width: 100%;
		display: block;
	}
	.his .outline table tr td {
		padding: 0 0 .5em;
		font-size: 1.3em;
		line-height: 1.4em;
		width: 100%;
		display: block;
	}
	.his .outline table tr td dl dt {
		/*float: left;*/
		width: 30%;
		padding: 3px 0;
	}
	.his .outline table tr td dl dd {
		/*float: left;*/
		width: 70%;
		padding: 3px 0;
	}
	.his .award {
		width: auto;
		margin: 7em auto 0;
	}
	.his .award h3 {
		font-size: 28px;
	}
	.his .award ul {
		list-style: none;
		overflow: hidden;
		display:block;
	}
	.his .award ul li {
		/*float: left;*/
		width: auto;
		margin: 2% 0 0 0;
		padding: 1em 0;
	}
	.his .award ul li img {
	}
	.his .award ul li span {
		display: inline-block;
		font-size: 1.3em;
	}
	.his .warehouse{margin:2em auto;}

}








/*
トップページ
v1.0.0
Last Updated: 2020-11-26
Author: nakamoto
*/

.idx{min-width: 640px;}
.idx img{
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}
.idx .vertical-rl{writing-mode: vertical-rl;}
.idx input{display: none;}

/* ********** 看板　パーツ ********* */

.idx .idx_anime > div{
    position: relative;
    font-size: 0;
    
}
.idx .idx_anime video{width: 100%;}
.idx .idx_anime video:nth-child(1){display: block;}
.idx .idx_anime video:nth-child(2){display: none;}

/* ローディング　アニメ*/
.idx .loading_icon {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    z-index: -1;
    width: 25px;
    height: 25px;
    clear: both;
}
.idx .loading_icon-circle {
    border: 4px rgba(0, 0, 0, 0.25) solid;
    border-top: 4px black solid;
    border-radius: 50%;
    -webkit-animation: spCircRot 1.5s infinite linear;
    animation: spCircRot 1.5s infinite linear;
}
@-webkit-keyframes spCircRot {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
  }
}
@keyframes spCircRot {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}
/* ********** スクロー促しアニメ ********* */
.idx a.arrow_scroll {
    position: sticky;
    bottom: 46px;
    left: calc((100% - 0px) / 2);
    z-index: 2;
    display: inline-block;
    transition: all .3s ease 0s;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    text-decoration: none;
    color:#ccc;
    font-size: 1.4em;
    letter-spacing: 1px;
    padding-top: 0;
    opacity: 0;
}
.idx a.arrow_scroll.observe_item.observed {
    opacity: 0 !important;
}
  .idx a.arrow_scroll span {
    position: absolute;
    top: 0;
    left: 50%;
    width: 46px;
    height: 46px;
    margin-left: -23px;
    border: 0px solid #fff;
    border-radius: 100%;
    box-sizing: border-box;
    transition: all .6s ease 0s;
    
  }
  .idx a.arrow_scroll div{transition:all .6s  ease 0s; font-size: 1.4rem;}
  .idx a.arrow_scroll span::after {
    position: absolute;
    top: 50%;
    left: 50%;
    content: '';
    width: 16px;
    height: 16px;
    margin: -12px 0 0 -8px;
    border-left: 2px solid #888;
    border-bottom: 2px solid #888;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    box-sizing: border-box;
  }
  .idx a.arrow_scroll span::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    content: '';
    width: 44px;
    height: 44px;
    box-shadow: 0 0 0 0 rgba(255,255,255,.1);
    border-radius: 100%;
    opacity: 1;
    box-sizing: border-box;
  }
  @-webkit-keyframes idxsdb {
    0% {
      opacity: 0;
    }
    30% {
      opacity: 1;
    }
    60% {
      box-shadow: 0 0 0 60px rgba(255,255,255,.1);
      opacity: 0;
    }
    100% {
      opacity: 0;
    }
  }
  @keyframes idxsdb {
    0% {
      opacity: 0;
    }
    30% {
      opacity: 1;
    }
    60% {
      box-shadow: 0 0 0 60px rgba(255,255,255,.1);
      opacity: 0;
    }
    100% {
      opacity: 0;
    }
  }

/* ********** クリック促しアニメ ********* */
.idx span.arrow_click {
    position: absolute;
    bottom: 0px;
    left: calc((100% - 46px) / 2);
    z-index: 2;
    display: inline-block;
    transition: all .3s ease 0s;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    text-decoration: none;
    color:#ccc;
    font-size: 1.4em;
    letter-spacing: 1px;
}
  .idx span.arrow_click {
    padding-top: 60px;
    opacity: 1;
  }
  .idx span.arrow_click span {
    position: absolute;
    top: 0;
    left: 50%;
    width: 46px;
    height: 46px;
    margin-left: -23px;
    border: 1px solid #fff;
    border-radius: 100%;
    box-sizing: border-box;
    transition: all .6s ease 0s;
    
  }
  .idx span.arrow_click div{transition:all .6s  ease 0s; font-size: 1.4rem;}
  .idx span.arrow_click span::after {
    position: absolute;
    top: 50%;
    left: 50%;
    content: '';
    width: 16px;
    height: 16px;
    margin: -8px 0 0 -12px;
    border-left: 1px solid #fff;
    border-bottom: 1px solid #fff;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-135deg);
    box-sizing: border-box;
  }
  .idx span.arrow_click span::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    content: '';
    width: 44px;
    height: 44px;
    box-shadow: 0 0 0 0 rgba(255,255,255,.1);
    border-radius: 100%;
    opacity: 1;
    animation-delay: 1s;
    box-sizing: border-box;
  }




  
/* ********** 創業　パーツ ********* */

.idx .idx_pheidias .idx_body{
    display: flex;
    position: relative;
    min-height: 100vh;
    color: #f0f0f0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-image: url(images/pheidias_k.jpg);
}

.idx .idx_pheidias .idx_body > div{flex-grow: 1;}
.idx .idx_pheidias .idx_body > div:nth-child(1),
.idx .idx_pheidias .idx_body > div:nth-child(3)
{width: calc(100% / 10 * 2);}


/* 創業　左　パーツ */
.idx .idx_pheidias .idx_body .column_left{
    display: flex;
    flex-direction: column-reverse;
}
.idx .idx_pheidias .idx_body .column_left h2{
    font-size: 3.2em;
    margin: auto;
}
.idx .idx_pheidias .idx_body .column_left span{
    height: 37.5vh;
    width: 2px;
    display: block;
    margin: 1em auto 2em;
    background: linear-gradient(0deg,rgba(255,255,255,.1) 20%, #fff 80%, rgba(255,255,255,.1));
}

/* 創業　中央　パーツ */
.idx .idx_pheidias .idx_body .column_center{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    overflow: hidden;
    opacity: 0;
}
.idx .idx_pheidias .idx_body .column_center > div:first-child,
.idx .idx_pheidias .idx_body .column_center > div:last-child
{display: none;}
.idx .idx_pheidias .idx_body .column_center p {
    padding-bottom: 2em;
}
.idx .idx_pheidias .idx_body .column_center p > span{
    display: block;
    text-align: center;
    font-size: 1.6em;
    line-height: 2;
}

#pheidias:checked ~ div .column_center{
    opacity: 1;
    pointer-events: all;
    overflow: auto;
}
#pheidias:checked ~ div .idx_body > div:nth-child(3){
    opacity: 0;
    transition: opacity .3s ease 0s;
    pointer-events: none;
}

#pheidias:checked ~ div .idx_body{
    min-height: 100vh;
}

/* 創業　右　パーツ */
.idx .idx_pheidias .idx_body > div:nth-child(3){
    display: flex;
    justify-content: flex-end;
}
.idx .idx_pheidias .idx_body .column_right{}
.idx .idx_pheidias .idx_body .column_right > div:nth-child(1){display: none; width: 150px;padding: 2em;}
.idx .idx_pheidias .idx_body .column_right > div:nth-child(2){
    display: block;
    position: absolute;
    top: 48vh;
    left: -66vw;
    font-size: 2.4em;
    line-height: 1.5;
    width: 500px;
}
.idx .idx_pheidias .idx_body .column_right > div:nth-child(2) > p > span:nth-child(3){
    display: block;
    font-size: .8em;
    line-height: 3;
    text-align: right;
    font-style: italic;
}
.idx .idx_pheidias .idx_body .column_right > div:nth-child(3){
    display: block;
    position: absolute;
    top: 78vh;
    left: -30vw;
    font-size: 1.6em;
}
.idx .idx_pheidias .idx_body .column_right > div:nth-child(3) > label{
   font-style: italic;
   cursor: pointer;
}

.idx .idx_pheidias .idx_body .column_right > div:nth-child(2) span{display: block;}





/* ********** 事業　パーツ ********* */
.idx .idx_bus{overflow: hidden;}
.idx .idx_bus a > div{
    position: relative;
    height: 100vh;
    perspective: 20px;
}
.idx .idx_bus a > div::before{
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(images/vision_k.jpg) ;
    transform: translateZ(0px);
    transition: transform .6s ease 0s; 
}
.idx .idx_bus a > div::after {
    content: "";
    width: 30%;
    min-width: 30em;
    height: 30%;
    position: absolute;
    bottom: calc((100% - 40%) / 2);
    right: 0;
    background-color: #1d1e32;
    transform: translateX(100%);
    transition: transform .6s ease 0s;
}
.idx .idx_bus a > div > div{
    width: 22%;
    min-width: 9em;
    line-height: 1.5;
    position: absolute;
    bottom: calc((100% - 1.6em) / 2);
    right: 2%;
    font-size: 3.2em;
    color: #fff;
    border-bottom: 1px solid #fff;
    text-align: right;
    z-index: 1;
    transform: translateX(-95vw);
    transition: transform .6s ease .1s, opacity .6s ease .1s;
    opacity: 0;
}

.idx .idx_bus {opacity: .2;transition: opacity .3s ease 0s;}
.idx .idx_bus.observed {opacity: 1;}
.idx .idx_bus:hover a > div::before{transform: translateZ(1px);}
.idx .idx_bus.observed a > div::after, 
.idx .idx_bus a > div > div.observed{transform: translateX(0);opacity: 1;} 
.idx .idx_bus span.arrow_click{
    bottom: -3.5em;
    left:  auto;
    right: 2%;
}
.idx .idx_bus a > div > div.observed span.arrow_click{
    opacity: 1;

}

/* ********** メッセージ　パーツ ********* */

/* 背景 */
.idx .idx_message{position: relative;overflow: hidden; opacity: .2;}
.idx .idx_message.observed{opacity: 1;transition: opacity .3s ease 0s;}
.idx .idx_message::before{
    content: "";
    position :absolute;
    width: 100%;
    height: 100vh;
    top: 0;
    right: 0;
    background-color: #1d1e32;
}
/*　メッセ */
.idx .idx_message a > div{
    position: relative;
    height: 100vh;
    perspective: 20px;
}
.idx .idx_message a > div::before{
    content: "";
    display: block;
    position: absolute;
    width: 70%;
    height: 100%;
    right: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(images/message_k.jpg) ;
    transform: translateZ(0px);
    transition: transform .6s ease 0s; 
}
.idx .idx_message a > div > div{
    width: 20%;
    min-width: 240px;
    line-height: 1.5;
    position: absolute;
    bottom: 18%;
    left: 4%;
    font-size: 3.2em;
    color: #fff;
    border-bottom: 1px solid #fff;
    transform: translateX(94vw);
    transition: transform .6s ease 0s, opacity .3s ease 0s;
    opacity: 0;
}
.idx .idx_message:hover a > div::before{transform: translateZ(1px);}
.idx .idx_message a > div > div.observed{transform: translateX(0);opacity: 1;} 
.idx .idx_message span.arrow_click{
    bottom: -3.5em;
    left:  0;
}

/* ********** FAQパーツ ********* */

.idx .idx_faq a > div{
    position: relative;
    height: 100vh;
}
.idx .idx_faq a > div::before{
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(images/qanda_k.jpg) ;
}
.idx .idx_faq a > div > div{
    width: 22%;
    line-height: 1.5;
    position: absolute;
    bottom: 12%;
    right: 4%;
    font-size: 5.6em;
    color: #111;
    border-bottom: 1px solid #111;
    text-align: right;
}


/* ********** 沿革パーツ ********* */

/* 背景 */
.idx .idx_history{position: relative;padding-bottom: 1em; overflow: hidden;opacity: 0.2;transition: opacity .3s ease 0s;}
.idx .idx_history.observed{opacity: 1;}
.idx .idx_history::before{
    content: "";
    position :absolute;
    width: 100%;
    height: 100vh;
    top: 20vh;
    right: 0;
    background-color: #1d1e32;
    transition: width .6s ease 0s;
}
/*　沿革 */
.idx .idx_history a > div{
    position: relative;
    height: 100vh;
    perspective: 20px;
}
.idx .idx_history a > div::before{
    content: "";
    display: block;
    position: absolute;
    width: 70%;
    height: 100%;
    right: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(images/company_k.jpg) ;
    transform: translateZ(0px);
    transition: transform .6s ease 0s; 

}
.idx .idx_history a > div > div{
    width: 22%;
    line-height: 1.5;
    position: absolute;
    bottom: 20%;
    left: 12%;
    font-size: 3.2em;
    color: #fff;
    border-bottom: 1px solid #fff;
    transform: translateX(86vw);
    opacity: 0;
    transition: transform .6s ease 0s, opacity .3s ease 0s;
}

@media screen and (min-width: 768px) {
    .idx .idx_history:hover a > div::before{transform: translateZ(1px);}
    .idx .idx_history:hover::before{ width: 94%;}
}
.idx .idx_history a > div > div.observed{transform: translateX(0);opacity: 1;}
.idx .idx_history span.arrow_click{
    bottom: -3.5em;
    left:  0;
}
.idx .idx_history .observed span.arrow_click{
    opacity: 1;
}




/* 採用案内 */
.idx .idx_recruit{position: relative; overflow: hidden;opacity: .2;transition: opacity .3s ease 0s;}
.idx .idx_recruit.observed{opacity: 1;}
.idx .idx_recruit::before{
    content: "";
    position :absolute;
    width: 96%;
    height: 80vh;
    top: 0;
    right: 0%;
    background-color: #1d1e32;
    transition: right .3s linear 0s;
}


.idx .idx_recruit a > div{
    position: relative;
    height: 100vh;
    perspective: 20px;
}
.idx .idx_recruit a > div::before{
    content: "";
    display: block;
    position: absolute;
    width: 70%;
    height: 100%;
    left: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(images/recruit_k.jpg) ;
    transform: translateZ(0px);
    transition: transform .6s ease 0s; 
}
.idx .idx_recruit a > div > div{
    width: 22%;
    line-height: 1.5;
    position: absolute;
    bottom: 40%;
    right: 12%;
    font-size: 3.2em;
    color: #fff;
    border-bottom: 1px solid #fff;
    text-align: right;
    transform: translateX(32vw);
    transition: transform .6s ease 0s, opacity .3s ease 0s;
    opacity: 0;
}
.idx .idx_recruit:hover a > div::before{transform: translateZ(1px);}
.idx .idx_recruit:hover::before{right: 4%;}
.idx .idx_recruit a > div > div.observed{transform: translateX(0);opacity:1;} 
.idx .idx_recruit span.arrow_click{
    bottom: -3.5em;
    left:  auto;
    right: 0;
}



/* ********** storeパーツ ********* */
.idx .idx_store{text-align: center; opacity: .2;transform: translateY(1em);transition: all 1s ease 0s;}
.idx .idx_store.observed{opacity: 1;transform: translateY(0);}
.idx .idx_store > a > div{
    width: 600px;
    margin: 4em auto;
    display: inline-block;
    position: relative;
    background-color: #1d1e32;
}

.idx .idx_slide ul{
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    font-size: 0;
}
.idx .idx_slide li{
    width: calc(100% / 3);
    opacity: .9;
    overflow: hidden;
}
.idx .idx_slide li img{
    transition: all .3s ease 0s;
}
.idx .idx_slide li img:hover{
    transform: scale(1.1);
}
.idx .idx_slide li:nth-child(n+7){display: none;}

.idx .slide_inner_text{
    position: absolute;
    left: 0;
    right: 0;
    top: calc(50% - .4em);
    text-decoration: none;
    color: #fff;
    font-size: 2.4em;
}

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

    .idx{min-width: auto;}

    /* ********** 看板　パーツ ********* */
    .idx .idx_anime > div > div{overflow: hidden;position: relative;min-height: 148vw;}
    .idx .idx_anime video:nth-child(1){display: none;}
    .idx .idx_anime video:nth-child(2){display: block;}

    /* ********** 創業　パーツ ********* */
    .idx .idx_pheidias{
        position: relative;
        z-index: 1;
    }
    .idx .idx_pheidias .idx_body{
        min-height: 50vh;
        transition: height .3s ease 0s; 
        background-image: url(images/pheidias_k_sp.jpg);

    }
    

    /* 創業　左　パーツ */
    .idx .idx_pheidias .idx_body .column_left{
        flex-direction: row;
        justify-content: center;
        padding-bottom: 10vh;
    }
    .idx .idx_pheidias .idx_body .column_left > div{
        display: flex;
    }

    .idx .idx_pheidias .idx_body > div:nth-child(1)
    {width: calc(100% / 10 * 4);}
    .idx .idx_pheidias .idx_body > div:nth-child(3)
    {width: calc(100% / 10 * 6);}

    .idx .idx_pheidias .idx_body .column_left h2{
        font-size: 2.8em;
        line-height: 1.5;
        margin: auto;
    }

        
    /* 創業　中央　パーツ */
    .idx .idx_pheidias .idx_body > div:nth-child(2){
        /*position: absolute;*/
        z-index: 1;
        width: 100%;
        /*height: 120vh;*/
        padding: 1em;
        pointer-events: none;
    }
    .idx .idx_pheidias .idx_body .column_center{
    /*    position: sticky;
        top: 4.8em;
        height: auto;
        display: block;*/
        opacity: 0;
    /*    transition: all .3s ease 0s ;
        flex-direction: column;
        box-sizing: border-box;
        background-color: rgba(29,30,50,.9);
        background-image: url(images/pheidias_k_sp.jpg);
        width: 92vw;
        margin: 2vh auto;
        padding: 0 8vw;
        border: 1px solid #ccc;*/
    }

    .idx .idx_pheidias .idx_body .column_center > div:nth-child(1){
        text-align: right;
        padding: 6vw 0 3vw;
        font-size: 1.6em;
    }
    .idx .idx_pheidias .idx_body .column_center > div:nth-child(2){
        height: 45vh;
        transition: all 2s ease 0s;
        overflow: auto;
    }
    #pheidias:checked ~ div .idx_body .column_center > div:nth-child(2){
        height: 100%;
    }

    .idx .idx_pheidias .idx_body .column_center > div:nth-child(3){
        text-align: center;
        padding: 6vw 0 6vw;
        font-size: 1.4em;
    }
    /*.idx .idx_pheidias .idx_body .column_center > div:nth-child(1),
    .idx .idx_pheidias .idx_body .column_center > div:nth-child(3)
    {
        display: block;
    }*/
    .idx .idx_pheidias .idx_body .column_center p > span{
        display: inline;
        text-align: left;
        font-size: 1.4em;
        line-height: 2;
    }

    /* 創業　右　パーツ */
    .idx .idx_pheidias .idx_body > div:nth-child(3){
        align-items: flex-end;
        position: absolute;
    }
    .idx .idx_pheidias .idx_body .column_right{padding: 0 2em 2em 0;}
    .idx .idx_pheidias .idx_body .column_right > div:nth-child(1){display: none;}
    .idx .idx_pheidias .idx_body .column_right > div:nth-child(n+2){display: block;}
    .idx .idx_pheidias .idx_body .column_right > div:nth-child(2) {
        display: block;
        position: absolute;
        top: 20vh;
        left: -30vw;
        font-size: 1.4em;
        line-height: 1.5;
        width: 70vw;
    }
    .idx .idx_pheidias .idx_body .column_right > div:nth-child(2) span{display: block;}
    .idx .idx_pheidias .idx_body .column_right p > span{
        display: block;
        text-align: center;
        font-size: 1.2em;
        line-height: 1.5;
    }
    .idx .idx_pheidias .idx_body .column_right > div:nth-child(3) {
        display: block;
        position: absolute;
        top: 40vh;
        left: -30vw;
        font-size: .8em;
        width: 70vw;
        text-align: right;
    }
    .idx .idx_pheidias .idx_body .column_right > div:nth-child(3) > label{
        font-size: 1.6em;
        color: #fff;
    }
    #pheidias:checked ~ div .idx_body {
        min-height: auto;
    }



    /* ********** 事業　パーツ ********* */

    .idx .idx_bus a > div{
        z-index: -1;
    }
    .idx .idx_bus a > div::before{
        background-image: url(images/vision_k_sp.jpg) ;
    }
    .idx .idx_bus a > div::after {content: none;}
    .idx .idx_bus a > div > div{
        bottom: calc((100% - 1.6em) / 3);
        transform: translate(0, 1em);
        text-align: center;
        right: 0;
        opacity: 0;
    }
    .idx .idx_bus.observed a > div::after, .idx .idx_bus a > div > div.observed {
        transform: translateY(0);
        opacity: 1;
    }
    .idx .idx_bus a > div > div.scrollin{
        transform: translate(0, 0);        
    }
    
    .idx .idx_bus span.arrow_click {
        left: calc((100% - 46px) / 2);
        right: auto;
    }



    /* ********** メッセージ　パーツ ********* */

    .idx .idx_message a > div::before{
        width: 85%;
        height: 92%;
        left: 0;
        bottom: 4%;
        opacity: .8;
        background-image: url(images/message_k_sp.jpg) ;
    }
    .idx .idx_message a > div > div{
        width: 82%;
        bottom: 50%;
        left:  auto;
        right: 0;
        text-align: center;
        transform: translateY(1em);
    }
    .idx .idx_message a > div > div.observed{
        transform: translateY(0);
    }
    .idx .idx_message span.arrow_click {
        left: 0;
        right: 0;
        margin:auto;
    }
    /* ********** FAQパーツ ********* */
    .idx .idx_faq a > div > div{
        width: 50%;
        font-size: 4.8em;
    }
    .idx .idx_faq a > div::before{
        background-image: url(images/qanda_k_sp.jpg) ;
    }
    


    /* ********** 沿革パーツ ********* */

    /* 背景 */
    .idx .idx_history{position: relative;padding-bottom: 1em;}
    .idx .idx_history::before{
        content: "";
        position :absolute;
        width: 100%;
        height: 100vh;
        top: 0;
    }

    /*　沿革 */
    .idx .idx_history a > div{
        height: 42vh;
    }

    .idx .idx_history a > div::before{
        width: 90%;
        height: 100%;
        background-image: url(images/company_k_sp.jpg) ;
    }
    .idx .idx_history a > div > div{
        width: 50%;
        line-height: 1;
        bottom: 40%;
        left: 0;
        text-align: center;
        transform: translateY(1em);
        opacity: 0;
    }
    .idx .idx_history span.arrow_click {
        bottom: -3em;
        left: 0;
        right: 0;
        margin: auto;
    }
    .idx .idx_history a > div > div.observed{
        transform: translateY(0);
        opacity: 1;
    }


    /* 採用案内 */
    .idx .idx_recruit a > div{
        height: 61vh;
    }
    .idx .idx_recruit a > div::before{
        width: 94%;
        background-image: url(images/recruit_k_sp.jpg) ;
    }
    .idx .idx_recruit a > div > div{
        width: 50%;
        line-height: 1;
        bottom: 50%;
        right: 0;
        text-align: center;
        font-size: 3.2em;
        transform: translateY(1em);
    }
    .idx .idx_recruit a > div > div.observed{transform: translateX(0);}
    .idx .idx_recruit span.arrow_click {
        bottom: -3.0em;
        left: 0;
        right: 0;
        margin: auto;
    }    



    /* ********** storeパーツ ********* */

    .idx .idx_store > a > div{
        width: 100%;
    }
    .idx .idx_slide{
        overflow: hidden;
    }
    .idx .idx_slide ul{
        width: calc(70% * 8);
        flex-wrap: nowrap;
        animation-name: idx_slide;
        animation-duration: 18s;
        animation-timing-function: linear;
        animation-fill-mode:both;
        animation-iteration-count: infinite;
    }
    .idx .idx_slide li{width: calc(100% / 1);}
    .idx .idx_slide li:nth-child(n+7){display: block;}

    /* slide animation */
    @keyframes idx_slide {
        from {
        }
        to {
            transform: translateX(calc(-100% / 8 * 6 ));
        }
    }
    

}



/* *******************************************************
代表メッセージ
v1.0.0
Last Updated: 2020-11-26
Author: nakamoto
******************************************************** */

.mes{}
.mes img{max-width: 100%;max-height: 100%;width: auto;height: auto;}

/* ***** ローディングアニメ ***** */
.mes .loading_icon {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 1;
    width: 25px;
    height: 25px;
    clear: both;
}
.mes .loading_icon-circle {
    border: 4px rgba(255, 255, 255, 0.25) solid;
    border-top: 4px #fff solid;
    border-radius: 50%;
    -webkit-animation: spCircRot 1.3s linear;
    animation: spCircRot 1.3s linear;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
@-webkit-keyframes spCircRot {
  0% {
    opacity: 1;
    -webkit-transform: rotate(0deg);
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: rotate(359deg);
  }
}
@keyframes spCircRot {
  0% {
    opacity: 1;
    transform: rotate(0deg);
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: rotate(359deg);
  }
}

/* ********** スクロー促しアニメ ********* */
.mes a.arrow_scroll {
    position: absolute;
    bottom: 0px;
    left: calc((100% - 46px) / 2);
    z-index: 2;
    display: inline-block;
    transition: all .3s ease 0s;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    text-decoration: none;
    color:#ccc;
    font-size: 1.4em;
    letter-spacing: 1px;
}
  .mes a.arrow_scroll {
    padding-top: 60px;
    opacity: 0;
    animation: asd 1s;
    animation-delay: 4.9s;
    animation-fill-mode: both;
    animation-iteration-count: 1;


  }
  @keyframes asd {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  .mes a.arrow_scroll span {
    position: absolute;
    top: 0;
    left: 50%;
    width: 46px;
    height: 46px;
    margin-left: -23px;
    border: 1px solid #fff;
    border-radius: 100%;
    box-sizing: border-box;
    transition: all .6s ease 0s;
  }
  .mes .in-title-20per a.arrow_scroll span{opacity: 0 ; }
  .mes a.arrow_scroll div{transition:all .6s  ease 0s; }
  .mes .in-title-20per a.arrow_scroll div{opacity: 0; }
  .mes a.arrow_scroll span::after {
    position: absolute;
    top: 50%;
    left: 50%;
    content: '';
    width: 16px;
    height: 16px;
    margin: -12px 0 0 -8px;
    border-left: 1px solid #fff;
    border-bottom: 1px solid #fff;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    box-sizing: border-box;
  }
  .mes a.arrow_scroll span::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    content: '';
    width: 44px;
    height: 44px;
    box-shadow: 0 0 0 0 rgba(255,255,255,.1);
    border-radius: 100%;
    opacity: 0;
    -webkit-animation: sdb 3s infinite;
    animation: sdb 3s infinite;
    animation-delay: 4.65s;
    box-sizing: border-box;
  }
  @-webkit-keyframes sdb {
    0% {
      opacity: 0;
    }
    30% {
      opacity: 1;
    }
    60% {
      box-shadow: 0 0 0 60px rgba(255,255,255,.1);
      opacity: 0;
    }
    100% {
      opacity: 0;
    }
  }
  @keyframes sdb {
    0% {
      opacity: 0;
    }
    30% {
      opacity: 1;
    }
    60% {
      box-shadow: 0 0 0 60px rgba(255,255,255,.1);
      opacity: 0;
    }
    100% {
      opacity: 0;
    }
  }

/* ********** 表示アニメ ********* */
@media screen and (min-width: 768px) {
    .mes .in-title-20::before{
        transition: all .6s ease 0s;
        opacity: 0;
        transform: translateY(20vh);
    }
    .mes .in-title-20per::before{
        opacity: 1;
        transform: translateY(0vh);
    }
}

.mes .in-view10vh-20{
    transition: all .6s ease 0s;
    opacity: 0;
    transform: translateY(10vh);
}
.mes .in-view10vh-20per{
    opacity: 1;
    transform: translateY(0vh);
}



.mes .in-view10vh-30{
    transition: all .6s ease 0s;
    opacity: 0;
    transform: translateY(10vh);
}
.mes .in-view10vh-30per{
    opacity: 1;
    transform: translateY(0vh);
}

.mes .in-view10vh-50{
    transition: all .6s ease 0s;
    opacity: 0;
    transform: translateY(10vh);
}
.mes .in-view10vh-50per{
    opacity: 1;
    transform: translateY(0vh);
}



/* ********** 看板 ********* */
.mes .mes_head{
    position: relative;
    overflow-x: hidden;
    display: flex;
    height: 100vh;
    align-items: center;
    justify-content: center;
    background-color:#1d1e32 ;
}
.mes .mes_head::before{/* ロゴ */
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    background-size: 50%;
    background-position: 50%;
    background-repeat: no-repeat;
    background-image:url(message/images/mb_lg.png);
    opacity: 0;
    animation-name: fadeIn;
    animation-duration: 3s;
    animation-delay: 1.3s;
    animation-timing-function: ease-out;
    animation-fill-mode:both;
    transform: scale(.95);
}
.mes .time,
.mes .word
{    
    position: relative;
    color: #fff;
    text-align: center;
    font-size: 1.0em;
}
.mes .time > span{
    display: inline-block;
    font-size: 2.0em;
    line-height: 4em;
}
.mes .word > span{
    display: inline-block;
    font-size: 2.6em;
    line-height: 1.5em;
}

/* animation ※背景のロゴアニメは上で直接記述　*/
.mes .mes_head > div > div > span {
    animation-name: fadeIn;
    animation-duration: .6s;
    animation-timing-function: ease;
    animation-fill-mode:both;
}
.mes .mes_head > div > div > span:nth-child(2n-1){transform: translateY(.0em);}
.mes .mes_head > div > div > span:nth-child(2n){transform: translateY(0em);}

.mes .time > span:nth-child( 1){animation-delay: 2.05s;}
.mes .time > span:nth-child( 2){animation-delay: 2.1s;}
.mes .time > span:nth-child( 3){animation-delay: 2.15s;}
.mes .time > span:nth-child( 4){animation-delay: 2.2s;}
.mes .time > span:nth-child( 5){animation-delay: 2.25s;}
.mes .time > span:nth-child( 6){animation-delay: 2.3s;}
.mes .time > span:nth-child( 7){animation-delay: 2.35s;}
.mes .time > span:nth-child( 8){animation-delay: 2.4s;}
.mes .time > span:nth-child( 9){animation-delay: 2.45s;}

.mes .word > span:nth-child( 1){animation-delay: 3.5s;}
.mes .word > span:nth-child( 2){animation-delay: 3.55s;}
.mes .word > span:nth-child( 3){animation-delay: 3.6s;}
.mes .word > span:nth-child( 4){animation-delay: 3.65s;}
.mes .word > span:nth-child( 5){animation-delay: 3.7s;}
.mes .word > span:nth-child( 6){animation-delay: 3.75s;}
.mes .word > span:nth-child( 7){animation-delay: 3.8s;}
.mes .word > span:nth-child( 8){animation-delay: 3.85s;}
.mes .word > span:nth-child( 9){animation-delay: 3.9s;}
.mes .word > span:nth-child(10){animation-delay: 3.95s;}
.mes .word > span:nth-child(11){animation-delay: 4.0s;}
.mes .word > span:nth-child(12){animation-delay: 4.05s;}
.mes .word > span:nth-child(13){animation-delay: 4.10s;}
.mes .word > span:nth-child(14){animation-delay: 4.15s;}
.mes .word > span:nth-child(15){animation-delay: 4.20s;}
.mes .word > span:nth-child(16){animation-delay: 4.25s;}
.mes .word > span:nth-child(17){animation-delay: 4.30s;}
.mes .word > span:nth-child(18){animation-delay: 4.35s;}
.mes .word > span:nth-child(19){animation-delay: 4.40s;}
.mes .word > span:nth-child(20){animation-delay: 4.45s;}
.mes .word > span:nth-child(21){animation-delay: 4.50s;}
.mes .word > span:nth-child(22){animation-delay: 4.55s;}
.mes .word > span:nth-child(23){animation-delay: 4.60s;}
.mes .word > span:nth-child(24){animation-delay: 4.65s;}
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        transform: translateY(0) scale(1);
        opacity:1;
    }
}



/* ****** Messageタイトル部分 ******* */
.mes .title::before{
    content: "";
    display: block;
    max-width: 920px;
    height: 525px;
    margin: -18vh auto 0;
    background-size: cover;
    background-position: center;
    background-image: url(message/images/pic.jpg);
}

.mes .title > div{
    max-width: 920px;
    margin: auto;
    padding: 3.6em 0 7.2em;
    text-align: right;
}
.mes .title > div > div{
    display: inline-block;
}
.mes .title span{
    font-size: 7.2em;
    font-style: italic;
    color: #111;
}
.mes .title h1{
    line-height: 1.5;
    padding-left: .5em;
    text-align: left;
    color: #444;
}

/* ----------------------- */
/* ****** レイアウト ****** */ 
.mes .contents{min-width: 1200px;margin-bottom:4em ; }
.mes .contents > div{display: flex;}
.mes .contents > div > div{
    position: relative;
}
.mes .contents .ms_body{
    display: flex;
    justify-content: center;
    flex-direction: column;
}
.mes .contents .ms_body > div{margin: 0 auto;}
/* レイアウト ms_... 複合 */
.mes .contents.ms_01 > div > div
,.mes .contents.ms_03 > div > div
{width: calc(100% / 2);}
.mes .contents.ms_02 > div > div:first-child
,.mes .contents.ms_04 > div > div:first-child
{width: calc(54%);}
.mes .contents.ms_02 > div > div:last-child
,.mes .contents.ms_04 > div > div:last-child
{width: calc(46%);}
/* レイアウト ms_02 */
.mes .contents.ms_02 .ms_body{justify-content:start;}
/* レイアウト ms_03 */
.mes .contents.ms_03 > div{
    position: relative;
    padding: 6.4em 0;
    margin-bottom: 6.4em;
    background: linear-gradient(90deg,#1d1e32 calc(100% - 6em), #fff calc(100% - 6em));
}
/* レイアウト ms_04 */
.mes .contents.ms_04 > div{
    padding: 6.4em 0;
    background: linear-gradient(270deg,#e4e3e8 calc(100% - 6em), #fff calc(100% - 6em));
}
/* レイアウト ms_05 */
.mes .contents.ms_05 > div{
    flex-direction: column;
    flex-wrap: wrap;
    height: calc(100vh);
    min-height: 900px;
    border-bottom:2px solid #fff;
}
.mes .contents.ms_05 > div > div{height: calc(100% / 10 * 5);}
.mes .contents.ms_05 > div > div:nth-child(-n+2){width: calc(46%);}
.mes .contents.ms_05 > div > div:nth-child(n+3){width: calc(54%);}



/* ******* 文章部分 ****** */
/* タイトル */
.mes .contents .ms_body h2{
    font-size:3.2em ;
    line-height: 1.5;
    margin-bottom: 1.5em;
    color: #111;
    text-align: center;
}
.mes .contents .ms_body h2 span{display: block;}
.mes .contents .ms_body h2 span:last-child{padding-left: 0em;}
.mes .contents.ms_04 .ms_body h2{color: #1d1e32;}

/* 文 */
.mes .contents .ms_body p{
    box-sizing: border-box;
    padding: 0 0 3em ;
    font-size:1.2em;
    white-space: nowrap;
    line-height: 2.5;
    color: #444;
}
.mes .contents .ms_body p:last-child{margin: 0;}
.mes .contents .ms_body p span{
    display: block;
    text-align: center;
}
/* ms_01*/
.mes .contents.ms_01 .ms_body.in-view20vh-20{
    transition: all .6s ease 0s;
    opacity: 0;
    transform:translate3D(0,20vh,0);
    transform-origin: right;
}
.mes .contents.ms_01 .ms_body.in-view20vh-20per{
    transform:translate3D(0,0vh,0) ;
    opacity: 1;
}

.mes .contents.ms_01 .ms_image.in-view20vh-20{
    transition: all .6s ease 0s;
    transform: translate3d(0,10vh,0) ;
    transform-origin: left;
    opacity: 0;

}
.mes .contents.ms_01 .ms_image.in-view20vh-20per{
    transform:translate3D(0,0vh,0);
    opacity: 1;
}



/* ms_02*/
.mes .contents.ms_02 .ms_body.in-view20vh-20{
    transition: all .6s ease 0s;
    opacity: 0;
    transform:translate3D(0,20vh,0);
    transform-origin: left;

}
.mes .contents.ms_02 .ms_body.in-view20vh-20per{
    transform:translate3D(0,0vh,0) ;
    opacity: 1;
}

.mes .contents.ms_02 .ms_image.in-view20vh-20{
    transition: all .6s ease 0s;
    transform: translate3d(0,10vh,0);
    transform-origin: left;
    opacity: 0;

}
.mes .contents.ms_02 .ms_image.in-view20vh-20per{
    transform:translate3D(0,0vh,0);
    opacity: 1;
}

/* ms_03*/
.mes .contents.ms_03 .ms_body h2{color: #fff;}
.mes .contents.ms_03 .ms_body p span{color: #e7e7e7;}
.mes .contents.ms_03 .ms_image::before{
    display: block;
    width: 60%;
    border-bottom: 1px solid #fff;
    padding-bottom:.5em;
    margin-bottom: 1em;
    font-size: 1.6em;
    content: "モダンブルーの経営理念1";
    color: #e7e7e7;

}
/* ms_04*/
.mes .contents.ms_04 .ms_body p{color: #1d1e32;}
.mes .contents.ms_04 .ms_image::before{
    display: block;
    width: 60%;
    border-bottom: 1px solid #1d1e32;
    padding-bottom:.5em;
    margin:0 0 1em auto;
    font-size: 1.6em;
    content: "モダンブルーの経営理念2";
    color: #1d1e32;
    text-align:right ;

}
/* ms_05*/
.mes .contents.ms_05 .ms_body h2{
    margin: auto;
    padding: 0 0 9% 11%;
    color: #fff;
}
.mes .contents.ms_05 .ms_body h2 span:last-child{text-align: right;}
.mes .contents .vertical-rl{writing-mode: vertical-rl;}
.mes .contents.ms_05 .ms_body:nth-child(1){background:linear-gradient(0deg, #1a234a 9%, #fff 9%) ;}
.mes .contents.ms_05 .ms_body:nth-child(2){background-color: #1a234a;}
.mes .contents.ms_05 .ms_body:nth-child(4){background:linear-gradient(90deg, #1a234a 11%, #fff 11%) ;}
.mes .contents.ms_05 .ms_body:nth-child(1) > div{padding-bottom: 4.5%;}
.mes .contents.ms_05 .ms_body:nth-child(4) > div{padding-left: 11%;}



/* ******** 画像部分 スタイル ******* */
.mes .contents .ms_image span{
    display: inline-block;
    margin-bottom: 1.8em;
}
.mes .contents .ms_image{overflow: hidden;}
.mes .contents.ms_02 .ms_image{padding-top: 14em;}
/* 各msイメージ疑似要素 */
.mes .contents .ms_image::after{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: contain;
    left: 0;
}
.mes .contents.ms_01 .ms_image::after{background-image: url(message/images/ms_01.jpg);}
.mes .contents.ms_02 .ms_image::after{background-image: url(message/images/ms_02.jpg);}
.mes .contents.ms_03 .ms_image::after{background-image: url(message/images/ms_03.jpg);}
.mes .contents.ms_04 .ms_image::after{background-image: url(message/images/ms_04.jpg);}
.mes .contents.ms_05 .ms_image::after{background-image: url(message/images/ms_05.jpg);background-size: cover;}



@media screen and (max-width: 767px) {
    .mes .time,
    .mes .word
    {    
        font-size: 2.3vw;
    }
    .mes_head > div{width: 100%;}
    .mes{
        height: auto;
        perspective: none;

    }
    .mes > article,
    .mes > article > *,
    .mes > article > * > *,
    .mes > article > * > * > *
    {transform-style: flat;}
        
    /* ----------------------- */
    /* ****** Messageタイトル部分 ******* */



    .mes .title{
        background-color: #1d1e32;
    }
    .mes .title::before{
        max-width: 100%;
        height: 88vw;
        margin: auto;
        background-image: url(message/images/pic_sp.jpg);
    }

    .mes .title > div{
        max-width: none;
        width: 100%;
        padding: 1em 0 0em;
        text-align:left ;
    }
    .mes .title > div > div{
        width: 92%;
    }    
    .mes .title > div:nth-child(1){
        font-style: italic;    
    }
    .mes .title > div:nth-child(1) > div{
        background: linear-gradient(180deg, #1d1e32 42%, #ffffff 42%);
    }
    .mes .title span{
        display: block;
        background: linear-gradient(0deg, #1d1e32 30%, #ffffff 30%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: rgba(255,255,255,0.0);
        font-size: 22vw;
        line-height: 1.1;
        padding-left: 4%;
    }
    .mes .title h1{
        font-size: 4vw;
        line-height: 16vw;
        padding-left: 4%;
        text-align: center;
        color: #444;
    }
    
    /* ----------------------- */
    /* ****** レイアウト ****** */ 
    .mes .contents{min-width: auto ;margin: auto;}
    .mes .contents > div{flex-wrap: wrap;}
    .mes .contents .ms_body{flex-direction: column-reverse;margin: auto;}
    .mes .contents .ms_body > div{width: 100%;box-sizing: border-box;}
    .mes .contents .ms_body > div:last-child{padding: 2em 0 0;}

    /* レイアウト ms_... 複合 */
    .mes .contents.ms_01 > div,
    .mes .contents.ms_02 > div
    {
        width: 92%;
    }

    .mes .contents.ms_01 > div > div
    ,.mes .contents.ms_02 > div > div
    ,.mes .contents.ms_03 > div > div
    {width: 100%;}
    .mes .contents.ms_01 .ms_body > div:last-child,
    .mes .contents.ms_02 .ms_body > div:last-child
    {background-color: #fff;}

    /* ********** 表示アニメ ********* */
    .mes .in-title-20per{
        opacity: 1;
        transform: translateY(0vh);
    }
    .mes .in-title-20::before{
        transition: all .6s ease 0s;
        opacity: 0;
        transform: translateY(20vh);
    }
    .mes .in-title-20per::before{
        opacity: 1;
        transform: translateY(0vh);
    }






    
    /* ms_01*/
    .mes .contents.ms_01{background-color: #1d1e32;}
    .mes .contents.ms_01 .ms_body > div:first-child{
        position: relative;
        top: -22vw;
        margin-bottom: -22vw;
        z-index: 1;
    }
    .mes .contents.ms_01 p:last-child{padding-bottom:33vw ;}


    .mes .contents.ms_01 .ms_body.in-view20vh-20{
        transform:translate3D(0,0vh,0) scale(1);
        margin: 0vh 0 0vh;
        opacity: 1;
    }
    .mes .contents.ms_01 .ms_body.in-view20vh-20per{
        transform:translate3D(0,0vh,0) scale(1);
    }


    .mes .contents.ms_01 .ms_body.in-view20vh-20 p{
        transition: all .6s ease 0s;
        opacity: 0;
    }
    .mes .contents.ms_01 .ms_body.in-view20vh-20per p{
        opacity: 1;
    }



    .mes .contents.ms_01 .ms_body.in-view20vh-20 h2::before{
        transition: all .6s ease 0s;
        transform: translate3d(0,0vh,0) scale(1);
        opacity: 0;
    
    }
    .mes .contents.ms_01 .ms_body.in-view20vh-20per h2::before{
        transform:translate3D(0,0vh,0) scale(1);
        opacity: 1;
    }
    
    /* ms_02 */
    .mes .contents.ms_02{background-color: #1d1e32;}
    .mes .contents.ms_02 > div > div:first-child{width: 100%;}
    .mes .contents.ms_02 > div > div:last-child{width: 100%;}
    .mes .contents.ms_02 > div{margin: 0 0 0 auto;}
    .mes .contents.ms_02 .ms_body > div:first-child{
        border: 3vw solid #1d1e32; 
        background-color: #1a234a;
    }

    .mes .contents.ms_02 .ms_body.in-view20vh-20{
        opacity: 0;
        transform:translate3D(0,0vh,0) scale(1);
        margin: 0vh 0 0vh;
    }
    .mes .contents.ms_02 .ms_body.in-view20vh-20per{
        transform:translate3D(0,0vh,0) scale(1);
        opacity: 1;
    }

    .mes .contents.ms_02 .ms_image.in-view20vh-20{
        transform: translate3d(0,0vh,0) scale(1);
        margin: 0vh 0 0;
        opacity: 0;

    }
    .mes .contents.ms_02 .ms_image.in-view20vh-20per{
        transform:translate3D(0,0vh,0) scale(1);
        opacity: 1;
    }

    /* ms_03 */
    .mes .contents.ms_03{background-color: #1d1e32;}
    .mes .contents.ms_03 > div{
        background-color: #1d1e32;
        background: none;
        padding-bottom:0 ;
        margin-bottom: auto;
    }
    .mes .contents.ms_03 .ms_body{flex-direction: column;}
    .mes .contents.ms_03 .ms_body > div:last-child{background-color: #1d1e32;}

    /* ms_04 */
    .mes .contents.ms_04{background-color: #e4e3e8;}
    .mes .contents.ms_04 > div {
        background: none;
        flex-direction: column-reverse;
        padding:0 ;
    }
    .mes .contents.ms_04 > div > div:first-child{width: 100%;}
    .mes .contents.ms_04 > div > div:last-child{width: 100%;}
    .mes .contents.ms_04 .ms_body{flex-direction: column;}
    .mes .contents.ms_04 .ms_body > div:last-child{background-color: #e4e3e8;}

    /* ms_05 */
    .mes .contents.ms_05 > div{
        height: auto;
        min-height: auto;
        padding-bottom: 4em;
    }
    .mes .contents.ms_05 > div > div{height: auto;}
    .mes .contents.ms_05 > div > div:nth-child(-n+2){width: 100%;}
    .mes .contents.ms_05 > div > div:nth-child(n+3){width: 100%;}
    .mes .contents.ms_05 .ms_body:nth-child(2) > div{
        width: 92vw;
        margin: auto auto auto 0;
        padding: 0;
        background-color: #1a234a;
    }
    .mes .contents.ms_05 .ms_image{
        background:linear-gradient(180deg, #1a234a calc(100% - 8vw) , #fff calc(100% - 8vw)) ;
    }
    .mes .contents.ms_05 .ms_image > span{
        display: block;
        width: 92vw;
        margin: auto 0 auto auto ;

    }


    /* ----------------------- */
    /* ******* 文章部分 ****** */

    /* タイトル */
    .mes .contents .ms_body h2{
        font-size:2.1em ;
        line-height: 1.5;
        margin-bottom: 1.5em;
        color: #fff;
        text-align: center;
    }
    .mes .contents .ms_body h2{font-size:1.8em;}
    .mes .contents .ms_body h2 span:last-child{text-align: right;}

    /* ms_02 */
    .mes .contents.ms_02 .ms_body h2{margin:1em 1em 1.5em auto;}
    .mes .contents.ms_02 .ms_body h2 > span:first-child{text-align: left;}
    .mes .contents.ms_02 .ms_body h2 > span:last-child{padding-top:1em;text-align: right;}
    .mes .contents .vertical-rl_sp{writing-mode: vertical-rl;}
    .mes .contents .vertical-rl_sp .upright{
        text-combine-upright: all;
        -webkit-text-combine: horizontal;
        -ms-text-combine-horizontal: all;
    }

    /* ms_03 */
    .mes .contents.ms_03 .ms_body h2 span{font-size: 5.5vw;}
    .mes .contents.ms_03 .ms_body h2 span:last-child{text-align: center;}
    .mes .contents.ms_03 .ms_body h2::before{
        display: inline-block;
        line-height: 1.5;
        margin-bottom: 2em;
        content: "モダンブルーの経営理念1";
        border-bottom: 1px solid #fff;
        font-size: 3.5vw;
    }
    .mes .contents.ms_03 .ms_image{background: linear-gradient(0deg,#e4e3e8 50%, #1d1e32 50%);}
    .mes .contents.ms_03 .ms_image::before{display: none;}
    .mes .contents.ms_03 .ms_image span{
        display:block;
        width: 92vw;
        margin: 0 0 0 auto;
        padding-bottom: 3em;
    }

    /* ms_04 */
    .mes .contents.ms_04 .ms_body h2 span{font-size: 5.5vw;}
    .mes .contents.ms_04 .ms_body h2 span:last-child{text-align: center;}
    .mes .contents.ms_04 .ms_body h2::before{
        display: inline-block;
        line-height: 1.5;
        margin-bottom: 2em;
        content: "モダンブルーの経営理念2";
        border-bottom: 1px solid #1d1e32;
        font-size: 3.5vw;
        color: #1d1e32;
    }
    .mes .contents.ms_04 .ms_image::before{display: none;}

    /* ms_05 */
    .mes .contents.ms_05 .ms_body h2{
        width: 92vw;
        margin: auto auto 0 0;
        padding: 2em 0;
        color: #fff;
    }
    .mes .contents .vertical-rl{writing-mode: inherit;}
    .mes .contents.ms_05 .ms_body h2 span:last-child{padding-right: 1em;}
    .mes .contents.ms_05 .ms_body:nth-child(1){background:none;}
    .mes .contents.ms_05 .ms_body:nth-child(2){background-color: #fff;}
    .mes .contents.ms_05 .ms_body:nth-child(4){background:none ;}
    .mes .contents.ms_05 .ms_body:nth-child(1) > div{padding-bottom: 2em;}
    .mes .contents.ms_05 .ms_body:nth-child(4) > div{padding-left: 0;}


    /* ----------------------- */
    /* 文 */

    .mes .contents .ms_body p{
        padding: 0 4vw 3em;
        white-space: normal;
        background-color: #fff;

    }
    .mes .contents .ms_body p span{display: inline;}

    /* ms_03 */
    .mes .contents.ms_03 .ms_body p{
        padding: 0 8vw 3em;
        background-color: #1d1e32;
    }

    /* ms_04 */
    .mes .contents.ms_04 .ms_body p{
        padding: 0 8vw 3em;
        background-color: #e4e3e8;
    }

    /* ms_05 */
    .mes .contents.ms_05 .ms_body p{
        padding: 1em 8vw;
    }

    /* --------------------------------- */
    /* ******** 画像部分 スタイル ******* */

    .mes .contents.ms_01 .ms_image,
    .mes .contents.ms_02 .ms_image
    {display: none;}
    .mes .contents.ms_04 .ms_image span{
        margin-bottom: 0;
    }
    /* ----------------------- */
    /* 各msイメージ疑似要素 */

    /* ms_01 */
    .mes .contents.ms_01 .ms_body h2::before{
        content: "";
        display: inline-block;
        position: relative;
        margin-bottom: 1em;
        width: 76vw;
        height:calc(76vw / 1200 * 850);
        background-repeat: no-repeat;
        background-size: cover;
        left: 12vw;
        z-index: 1;
    }
    .mes .contents.ms_01 .ms_body h2::before{background-image: url(message/images/ms_01.jpg);}

    /* ms_02 */
    .mes .contents.ms_02 .ms_body h2::after{
        content: "";
        display: inline-block;
        position: relative;
        width: 70vw;
        height:calc(70vw / 1200 * 850);
        background-repeat: no-repeat;
        background-size: cover;
        left: -5vw;
        top: 20vw;
    }
    .mes .contents.ms_02 .ms_body h2::after{background-image: url(message/images/ms_02.jpg);}


/*    
    .mes .sp-view10vh-20{
        transition: all .6s ease 0s;
        opacity: 0 !important;
        transform: translateY(10vh) !important;
    }
    .mes .sp-view10vh-20per{
        opacity: 1 !important;
        transform: translateY(0vh) !important;
    }
*/

}




/*
    Q&A
    v1.0.0
    Last Updated: 2020-08-07
    Author: nakamoto
*/
.faq{}
.faq::before{
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100vh;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(faq/images/qanda_k.jpg);
}
.faq img{
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}


.faq .faq_head > div{
    padding:4.8em 0;
    margin-bottom: 6.4em;
    background-color: #1d1e32;
    text-align: center;
}
.faq .faq_head h1{color: #fff;}
.faq .faq_head h1 > span{display: block;}
.faq .faq_head h1 > span:nth-child(1){font-size: 4.2em;margin-bottom: 1.6rem;}
.faq .faq_head h1 > span:nth-child(2){font-size: 1.6em;}

.faq .faq_body > div{
    box-sizing: border-box;
    width: 900px;
    margin: 0 auto 240px;
    padding: 120px 120px 0 120px;
    background-color: rgba(255,255,255,.9);
}

.faq .faq_body > div > dl{padding-bottom: 12.8em;}
.faq .faq_body > div > dl > dt{
    display: flex;
    align-items: center;
    padding: 1em 0;
    margin-bottom: 1em;
    border-bottom: 1px solid #c1c1c3;
}
.faq .faq_body dt > span{}
.faq .faq_body dt > span:nth-child(1){width: 20px;}
.faq .faq_body dt > span:nth-child(2){padding-left:.5em; font-size:1.4em;}
.faq .faq_body dt h2{color: #111;}
.faq .faq_body dd > p{font-size: 1.2em;line-height: 1.6; color: #333;}
/* 遅延表示する要素 */
.faq .faq_body > div > dl > dt {transform: translateY(3em);opacity: 0; transition: transform 0.9s,opacity 0.9s}
.faq .faq_body > div > dl > dd > * {transform: translateY(3em);opacity: 0; transition: transform 0.9s,opacity 0.9s}
.faq .in-view{transform: translateY(0) !important;opacity: 1 !important; }

/************************/
/*____  aacd関連 ____*/
.faq .aacd{
    width: 520px;
    margin: 3.6em auto;
    box-sizing: border-box;
    padding: 20px 50px;
    background-color: #fff;
}
.faq .aacd > div{
    display: flex;
    align-items: center;
}
.faq .aacd > div > span:nth-child(1){
    width: 70px;
}
.faq .aacd > div > span:nth-child(2){
    font-size: 1.2em;
    padding-left: 1em;
    line-height: 1.6;
}

/************************/
/*____  本物関連 ____*/
.faq .honmonoFigure{
    display:flex;
	text-align:center;
	width:520px;
	list-style-type:none;
	margin: auto;
}
.faq .honmonoFigure > li{width:50%;}
.faq .honmonoFigure > li:nth-child(1){background-color:#121f32;}
.faq .honmonoFigure > li:nth-child(2){background-color:#b02119;}
.faq .honmonoFigure dl{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}
.faq .honmonoFigure dt{
	width:100%;
	padding-bottom:0.5em;
	color:#fff;
}
.faq .honmonoFigure dd{
	display: flex;
	flex-wrap:wrap;
	justify-content: center;
	align-items: center;
	line-height:1.25;
}
.faq .honmonoFigure > li:nth-child(1) dd{
	color:#121f32;
	background-color:#c0d0e7;
}
.faq .honmonoFigure > li:nth-child(2) dd{
	color:#b02119;
	background-color:#e4c0ce;
}
.faq .honmonoFigure span{
	display:block;
}
.faq .honmonoFigure > li{padding:2em;}
.faq .honmonoFigure dt{
	font-size:1.8em;
}
.faq .honmonoFigure dd{
	min-height:4.2em;
	width:calc(50% - 2px - 1em);
	padding:0.5em;
	font-size:1.8em;
}
.faq .honmonoFigure span{
	font-size:.5em;
}



/************************/
/*____  並行関連 ____*/
.faq .arrowFigure{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	text-align:center;
	width:520px;
	box-sizing:border-box;
	list-style-type:none !important;
	margin:3.6em auto 0;
	max-width:none;
}
.faq .arrowFigure > li{
	margin-bottom:4.8em;
	padding:1.2em 0;
	position:relative;
	color:#fff !important;
	background-color:#121f32;
}
.faq .arrowFigure > li:last-child{	margin-bottom:0;}

.faq .arrowFigure > li:nth-child(2)::before,
.faq .arrowFigure > li:nth-child(3)::before{
	content:"↓";
	position:absolute;
	top:-1.5em;
	left:0;
	text-align:center;
	width:100%;
	font-size:1.4em;
	color:#111;
}
.faq .arrowFigure > li::after{
	content:"↓";
	position:absolute;
	bottom:-3em;
	left:0;
	text-align:center;
	width:100%;
	font-size:1.4em;
	color:#111;
}

.faq .arrowFigure > li:first-child,
.faq .arrowFigure > li:last-child
{width:100%;}
.faq .arrowFigure > li:first-child::after,
.faq .arrowFigure > li:last-child::after
{content:normal;}

.faq .arrowFigure span:not(.chushaku){
	position:absolute;
	bottom:175%;
    right:0;
    left: 0;
    margin: auto;
	line-height:1.2em;
	color:#3f7fc7;
	width:60%;
	text-align:center;
    font-size:0.95rem;
    display: inline-block;
}

.faq .arrowFigure span.chushaku{
	position:absolute;
	top:7em;
    right:0;
    left: 0;
    margin: auto;
	font-size:0.75rem;
	line-height:1.2em;
	color:#3f7fc7;
	width:45%;
	text-align:left;
	display: flex;
	align-items: center;
	height: 2.4em;
	white-space:nowrap;
}

.faq .arrowFigure > li{
	width:calc(50% - 2em);
    font-size:1.4em;
    line-height:1.5 ;
}
.faq .arrowFigure div{
	display:inline-block;
	vertical-align:baseline !important;
	width:auto !important;
	padding:0 !important;
	margin:0 !important;
	color:#fff;
}

/************************/
/*____  なぜ安関連 ____*/
.faq .yasui.arrowFigure span:not(.chushaku){
	bottom:initial;
	top:120%;
}

@media screen and (max-width: 767px) {
    .faq::before{
        background-image: url(faq/images/qanda_k_sp.jpg);
    }
    
    .faq .faq_head > div {
        padding: 2.4em 0;
        margin-bottom: -1.0em;
    }


    .faq .faq_body > div{
        width: calc(100% - 2em);
        margin: 0 auto 1em;
        padding: 6em 2em 0;
    }
    .faq .faq_body > div > dl {padding-bottom: 6.4em;}
    .faq .faq_body > div > dl > dt {justify-content: center;}
    /************************/
    /*____  aacd関連 ____*/
    .faq .aacd{
        width: 100%;
        margin: 3.6em auto;
        padding: 1em;
    }
    .faq .aacd > div > span:nth-child(1){
        width: calc((100% - 2em) / 10 * 3);
    }
    .faq .aacd > div > span:nth-child(2){
        font-size: 1.1em;
    }
    

    /************************/
    /*____  本物関連 ____*/
    .faq .honmonoFigure{
        width:100%;
    }
    .faq .honmonoFigure > li{padding:1em;}
    .faq .honmonoFigure dt {font-size: 4.5vw;}
    .faq .honmonoFigure dd{
        font-size: 4vw;   
        width: calc(50% - 2px - .2em);
        padding: 0.1em;
    }
    .faq .honmonoFigure span {
        font-size: .5em;
    }
    /************************/
    /*____  並行関連 ____*/
    .faq .arrowFigure{
        width:100%;
    }
    .faq .arrowFigure > li{font-size: 1.2em;}
    .faq .arrowFigure span.chushaku{
        width:auto;
    }
    .faq .arrowFigure span:not(.chushaku) {
        width: auto;
    }
            
}







/*
お問い合わせ
v1.0.0
Last Updated: 2020-08-24
Author: okada
*/
.inq {
	margin: 70px auto 0;
	width: 900px;
	background: #fff;
	border-radius: 3px;
	padding: 0 0 50px;
}
.inq h1 {
	/*background: #1d1e32;*/
	text-align: center;
	padding: 4.8em;
	/*margin: 0 0 6.4em;*/
}
.inq h1 span {
	display: block;
	font-family: vdl-v7mincho, sans-serif;
}
.inq h1 span.main {
	font-size: 4.2em;
	margin: 0 0 1.6rem;
}
.inq h1 span.sub {
	font-size: 1.6em;
}
.inq .inquiry {
	width: 600px;
	margin: 0 auto;
}
.inq .inquiry .error-messages {
	border: solid 1px #1d1e32;
	padding: 15px 20px;
}
.inq .inquiry .error-messages p {
	font-size: 1.2em;
}
.inq .inquiry .error-messages ul {
	list-style: none;
	margin: 8px 0 0;
}
.inq .inquiry .error-messages ul li {
	font-size: 1.2em;
	line-height: 1.4em;
}
.inq .inquiry table {
	margin: 0 auto;
	width: 100%;
}
.inq .inquiry table tr {
	border-bottom: 1px solid #eee;
}
.inq .inquiry table tr:last-child {
	border-bottom: none;
}
.inq .inquiry table tr th,
.inq .inquiry table tr td {
	display: inline-block;
}
.inq .inquiry table tr th {
	padding: 15px 0 0;
	font-size: 1.4em;
	line-height: 1.6em;
	width: 100%;
	text-align: left;
	vertical-align: middle;
}
.inq .inquiry table tr td {
	padding: 10px 0 20px;
	font-size: 1.4em;
	line-height: 1.6em;
	width: 100%;
	vertical-align: middle;
}
.inq .inquiry table tr td[colspan="2"] {
	text-align: center;
	padding: 30px 0 0;
}
.inq .inquiry table tr td input,
.inq .inquiry table tr td textarea {
	border: none;
	background: #efefef;
	border-radius: 5px;
	width: 80%;
	padding: 10px;
	font-size: 1em;
}
.inq .inquiry table tr td button,
.inq .inquiry table tr td a.btn {
	background: #1d1e32;
	border: none;
	color: #fff;
	font-size: 1.2em;
	border-radius: 3px;
	
	padding: 7px 20px;
}
.inq .inquiry table tr td button {
	cursor: pointer;
}
.inq .inquiry table tr td a.btn {
	text-decoration: none;
	margin-right: 20px;
}
.inq .thanks {
	width: 500px;
	margin: 0 auto;
}
.inq .message {
	margin: 30px 0 0;
	font-size: 1.4em;
	line-height: 1.6em;
}
.inq .thanks .button {
	text-align: center;
	margin: 70px 0 0;
}
.inq .thanks .button .btn {
	display: inline-block;
	background: #1d1e32;
	border: none;
	color: #fff;
	font-size: 1.6em;
	border-radius: 3px;
	
	padding: 10px 30px;
}
@media screen and (max-width: 767px) {
	.inq {
		margin: 50px 10px 0;
		width: auto;
		/*background: #fff;
		border-radius: 3px;
		padding: 0 0 50px;*/
	}
	.inq h1 {
		/*background: #1d1e32;*/
		text-align: center;
		padding: 2em;
		/*margin: 0 0 6.4em;*/
	}
	.inq h1 span {
		/*display: block;
		font-family: vdl-v7mincho, sans-serif;*/
	}
	.inq h1 span.main {
		font-size: 2.4em;
		/*margin: 0 0 1.6rem;*/
	}
	.inq h1 span.sub {
		font-size: 1.4em;
	}
	.inq .inquiry {
		width: auto;
		margin: 0 10px;
	}
	.inq .inquiry .error-messages {
		/*border: solid 1px #1d1e32;
		padding: 15px 20px;*/
		
		/*margin: 0 10px;*/
	}
	.inq .inquiry .error-messages p {
		/*font-size: 1.2em;*/
		line-height: 1.4em;
	}
	.inq .inquiry .error-messages ul {
		/*list-style: none;
		margin: 8px 0 0;*/
	}
	.inq .inquiry .error-messages ul li {
		/*font-size: 1.2em;
		line-height: 1.4em;*/
	}
	.inq .inquiry table {
		margin: 0 auto;
		width: 100%;
	}
	.inq .inquiry table tr {
		border-bottom: 1px solid #eee;
	}
	.inq .inquiry table tr:last-child {
		border-bottom: none;
	}
	.inq .inquiry table tr th,
	.inq .inquiry table tr td {
		display: inline-block;
	}
	.inq .inquiry table tr th {
		/*padding: 15px 0 0;
		font-size: 1.4em;
		line-height: 1.6em;
		width: 100%;
		text-align: left;
		vertical-align: middle;*/
	}
	.inq .inquiry table tr td {
		/*padding: 10px 0 20px;
		font-size: 1.4em;
		line-height: 1.6em;
		width: 100%;
		vertical-align: middle;*/
	}
	.inq .inquiry table tr td input,
	.inq .inquiry table tr td textarea {
		/*border: none;
		background: #efefef;
		border-radius: 5px;*/
		width: 100%;
		/*padding: 10px;*/
		
		box-sizing: border-box;
	}
	.inq .inquiry table tr td button,
	.inq .inquiry table tr td a.btn {
		/*background: #1d1e32;
		border: none;
		color: #fff;
		font-size: 1.2em;
		border-radius: 3px;
		
		padding: 7px 20px;*/
	}
	.inq .inquiry table tr td button {
		/*cursor: pointer;*/
	}
	.inq .inquiry table tr td a.btn {
		/*text-decoration: none;
		margin-right: 20px;*/
	}
	.inq .thanks {
		width: auto;
		margin: 0 50px;
	}
	.inq .message {
		margin: 20px 0 0;
		/*font-size: 1.4em;
		line-height: 1.6em;*/
	}
	.inq .thanks .button {
		/*text-align: center;*/
		margin: 50px 0 0;
	}
	.inq .thanks .button .btn {
		/*display: inline-block;
		background: #1d1e32;
		border: none;
		color: #fff;
		font-size: 1.6em;
		border-radius: 3px;
		
		padding: 10px 30px;*/
	}
}