@charset "utf-8";
/* 
font-family: 'Noto Sans JP', sans-serif;
*/
body {background: #000;  color: #fff;}
a {color: #fff; text-decoration: none;}
#wrapper {position: relative; width: 100%;}
.ff-sans {font-family: 'Noto Sans JP', sans-serif;}

/* common  ----------------------------------------------- */
.inrCont-01 {width: 90%; max-width: 940px; margin: 0 auto;}
.inrCont-02 {width: 90%; max-width: 1080px; margin: 0 auto;}
.inrCont-03 {width: 90%; max-width: 1098px; margin: 0 auto;}
.inrCont-04 {width: 90%; max-width: 900px; margin: 0 auto;}
.homTitle{text-align: center; font-weight: 300; font-family: 'Noto Sans JP', sans-serif; font-size: 14rem;}
.textBox {text-align: justify;}
.textBox p { opacity: 0.4; font-size: 4.4rem; display: inline; animation: textAnimation02 0.5s ease forwards; -webkit-animation: textAnimation02 0.5s ease forwards;}
.textBox p.fs-M {font-size: 8.5rem; line-height: 1.1;}
.textBox p.fs-L {font-size: 11rem; line-height: 1.1;}
.textBox p.active{ animation: textAnimation 0.5s ease forwards; -webkit-animation: textAnimation 0.5s ease forwards;}
a .grPhoto {position: relative; }
a .grPhoto .is_gray {position: absolute; left: 0; top: 0; z-index: 2; transition: all 0.3s ease;}
a:hover .grPhoto .is_gray {opacity: 0;}
.flex {display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap;}

@keyframes textAnimation {
  0% { opacity: 0.4;  }
  100% { opacity: 1; }
}
@keyframes textAnimation02 {
  0% { opacity: 1; }
  100% { opacity: 0.4; }
}

.fadeIn {
  visibility: hidden;
	opacity: 0;
  transform: translateY(60px); 
  transition: all 0.5s linear;
}
.fadeIn.is-inview {
  visibility: visible;
	opacity: 1;
  transform: translateY(0);
}

/* header  */
#header {transition: all 0.3s ease; z-index: 8; }
#header.fixed {position: fixed; background: rgba(0,0,0,0.6);}

/* footer*/
#footer {font-family: 'Noto Sans JP', sans-serif; padding: 270px 0 40px; text-align: center; font-size: 2.2rem;}
#pagetop {margin-bottom: 60px;}
#pagetop a {position: relative; }
#pagetop a::before {content: ""; width: 30px; height: 30px; border-top: 1px solid #fff; border-right: 1px solid #fff; position: absolute; left: 50%; top: -20px; transform: translateX(-50%) rotate(-45deg); }
#linkCorp {position: relative; margin-bottom: 120px;}
#linkCorp::before {content: ""; width: 100%; height: 2px; background: #fff; position: absolute; left: 0; top: 50%;}
#linkCorp  a {display: inline-block; border: 2px solid #fff; padding:  10px 30px; font-size: 2.7rem; background: #000; position: relative; z-index: 2;}
#linkCorp a:hover{opacity: 1 !important;  filter: alpha(opacity=100) !important; color: #aaa; border-color: #aaa; }
.lgFooter {margin-bottom: 30px;}
#external_link{display:flex; display: -webkit-flex; justify-content:space-between; align-items: center; width: 80%; margin: 0 auto 120px auto;}
#external_link span{width: 30%; border-bottom: 2px solid #fff; font-size: 2.5rem;}

/* visual(common) -------------------------------------- */
#homVisual {width: 100%;  position: relative; display: flex; display: -webkit-flex; justify-content: center; align-items: center; background-color: #000; background-image: url("../img/common/bg-mainVisual-01.jpg"); background-position: center center; background-repeat: no-repeat; background-size: cover;}
@media (aspect-ratio: 16/9), (min-aspect-ratio: 16/9) {	#homVisual {height: 100vh;}	}
@media (max-aspect-ratio: 16/9) {	#homVisual {height: 60vw; }	}
#homVisual .homTxtVisual {text-align: center; width: 98%; }
#homVisual .homTxtVisual p {font-size: 3vw; font-weight: 300;}
#homVisual .homTxtVisual h2 {font-size: 6vw; line-height: 1.3; }
#homVisual .homTxtVisual h2 span{margin: 0!important; padding: 0!important; }
#homVisual .homVisScroll {margin: 0; position: absolute; left: 50%; bottom: 0; color: #646464;font-size: 3rem; text-align: center; transform: translateX(-50%);}
#homVisual .homTxtVisual .ls-01 {letter-spacing: -1vw;}
#homVisual .homTxtVisual .ls-02 {letter-spacing: -3vw;}
#homVisual .homTxtVisual .ls-03 {letter-spacing: -4vw;}

/* visual(our_dx) -------------------------------------- */
#our_dx_Visual {width: 100%; max-width: 1500px; position: relative; display: flex; display: -webkit-flex; justify-content: center; align-items: flex-end; background-color: #000; min-height: 680px; margin: 0 auto; padding: 120px 0 0 0;}
#our_dx_Visual h2 {display: block; padding-bottom: 2%;}
#our_dx_Visual h2 p{display: block; color: white; background-color: black; font-size: 3.2rem; text-align: center; padding: 0 1rem; margin: 0 0 10px 0;}

.our_dx_Visual_spedial {background-image: url("../img/our_dx/bg-mainVisual-01.jpg"); background-position: center 120px; background-repeat: no-repeat; background-size: cover;}
.our_dx_Visual_vol01 {background-image: url("../img/our_dx/bg-mainVisual-02.jpg"); background-position: center 120px; background-repeat: no-repeat; background-size: cover;}
.our_dx_Visual_vol02 {background-image: url("../img/our_dx/bg-mainVisual-03.jpg"); background-position: center 120px; background-repeat: no-repeat; background-size: cover;}
.our_dx_Visual_vol03 {background-image: url("../img/our_dx/bg-mainVisual-04.jpg"); background-position: center 120px; background-repeat: no-repeat; background-size: cover;}
.our_dx_Visual_vol04 {background-image: url("../img/our_dx/bg-mainVisual-05.jpg"); background-position: center 120px; background-repeat: no-repeat; background-size: cover;}



/* catch(common) -------------------------------------- */
#homCatch { padding: 80px 0 0;}

/* message(common) -------------------------------------- */
#message { margin: 160px 0 0;}
.msgMovie {position: relative;  width: 100%;  height: 0;  padding-bottom: 56.25%;  overflow: hidden;  margin-bottom: 20px; border: 2px solid #fff;background:#fff;}
.msgMovie .movieMsg { width: 100%;  height: 100%; position: absolute; top: 0;  left: 0;}
.msgMovie #player { width: 100%;  height: 100%; position: absolute; top: 0;  left: 0;}
.msgName {text-align: center; font-size: 2.2rem;}

/* dx(common) -------------------------------------- */
#dx { margin: 160px 0 0;}
.dxExample {margin-top: 80px;}
.dxImg .dxPhoto {margin-bottom: 15px; background: #fff; }
.dxImg .dxPhoto img {border: 2px solid #fff; width: 100%;}
.dxImg p {margin-bottom: 0;text-align: center; font-size: 2.2rem; font-family: 'Noto Sans JP', sans-serif;}
.dxTitle {text-align: center; margin:80px 0 20px; font-size: 6.5rem; font-weight: 300; }
.dxFlex .dxImg {width: 48%; margin-bottom: 40px;}

/* workspace (common)-------------------------------------- */
#workspace { margin: 160px 0 0;}
.worksMovie {position: relative;  width: 100%;  height: 0;  padding-bottom: 56.25%;  overflow: hidden;  margin-bottom: 20px; border: 2px solid #fff;}
.worksMovie #player2 { width: 100%;  height: 100%; position: absolute; top: 0;  left: 0;}
.worksMovie {text-align: center; font-size: 2.2rem;}
.worksName {text-align: center; font-size: 2.2rem;}


/* career (common)-------------------------------------- */
#redruit { margin: 160px 0 0;}
#redruit .flex {background: #d1d1d1;}
.carContent {width: 50%;   color: #000; font-size: 2.2rem;} 
.carContent .carImg {height: 480px; background-size: cover; background-position: center top; background-repeat: no-repeat;}
.carInrCont {padding: 50px 0 145px; width: 76%; margin: 0 auto;}
.carInrCont p { font-family: 'Noto Sans JP', sans-serif;}
.carInrCont .linkMore {text-align: center; margin: 0;}
.carInrCont .linkMore a {color: #000; position: relative; padding-right: 50px;}
.carInrCont .linkMore a::before {content: ""; width: 34px; height: 30px; position: absolute; right: 0; top: 50%; background: url("../img/home/icon_link.png") center center no-repeat; background-size: contain; transform: translateY(-50%);}

.carInrCont .carTtl {text-align: center; font-weight: 600; font-size: 2.8rem; margin-bottom: 40px;}
.carInrCont h3 {text-align: center; font-size: 4.5rem; line-height: 1.4; margin-bottom: 40px; letter-spacing: -0.3rem;}

.boxCareer .carImg {background-image: url("../img/home/img-career-01_gr.jpg");}
.boxCareer .carImg.is_color {background-image: url("../img/home/img-career-01.jpg");}
.boxNew .carImg {background-image: url("../img/home/img-career-02_gr.jpg");}
.boxNew .carImg.is_color {background-image: url("../img/home/img-career-02.jpg");}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
pcSetting
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (min-width:768px) {
 /* hover */
a:hover p, a:hover {opacity: .7 !important;  filter: alpha(opacity=80); text-decoration: none; transition: all 0.2s ease-in-out; }
.clickable:hover {filter: alpha(opacity=70) !important;opacity: .7 !important;transition: all 0.2s ease-in-out;}

#header{position: absolute; left: 0; top: 0; width: 100%;  padding: 60px 0;}
#header.fixed { padding: 30px 0;}
#header .inrHeader {font-family: 'Noto Sans JP', sans-serif; width: 90%; margin: 0 auto; display: flex; display: -webkit-flex; justify-content: flex-end; position: relative;}
#header .inrHeader #hdLogo { position: absolute; left: 0; top: 0;}
#header .inrHeader #navGlobal ul {display: flex; display: -webkit-flex; font-weight: 600;}
#header .inrHeader #navGlobal ul  li {margin:  0 25px;}
#btnGlobal {display: none;}
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
tabletSetting
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (max-width: 1200px) and (min-width: 768px) {
/* header */
#header{ padding: 5vw 0; }
#header.fixed { padding: 2.5vw 0;}
#header .inrHeader #hdLogo img {width: 7.58vw;}
#header .inrHeader #navGlobal ul  li {margin:  0 2vw; font-size: 1.33vw}

/* footer*/
#footer {padding: 22.5vw 0 3.3vw;  font-size: 1.83vw;}
#pagetop {margin-bottom: 5vw;}
#pagetop a::before {width: 2.5vw; height: 2.5vw; top: -1.66vw;  }
#linkCorp {margin-bottom: 10vw;}
#linkCorp  a {  padding:  0.83vw 2.5vw; font-size: 2.25vw; }
.lgFooter {margin-bottom: 2.5vw;}
.lgFooter img {width: 21.5vw;}
#external_link{margin-bottom: 10vw; width: 90%;}	
#external_link span{font-size: 2.0vw;}	


/* common  */
.homTitle{font-size: 11.66vw;}
.textBox p { font-size: 3.6vw;  }
.textBox p.fs-M {font-size: 7.08vw; }
.textBox p.fs-L {font-size: 9.16vw;}

/* visual */
#homVisual .homVisScroll { font-size: 2.5vw;}
#homVisual .homVisScroll  img {width: 2.6vw; height: auto;}

/* catch */
#homCatch { padding: 6.6vw 0 0;}

/* message */
#message { margin: 13vw 0 0;}
.msgMovie {margin-bottom: 4vw; }
.msgName {font-size: 1.83vw;}

/* dx */
#dx { margin: 13vw 0 0;}
.dxExample {margin-top: 6.6vw;}
.dxImg .dxPhoto {margin-bottom: 1.25vw;}
.dxImg p {font-size: 1.83vw;}
.dxTitle { margin: 6.6vw 0 1.66vw; font-size: 5.4vw; }

/* workspace  */
#workspace { margin: 13vw 0 0;}
.worksMovie {margin-bottom: 4vw; }
.worksName {font-size: 1.83vw;}

/* career  */
#redruit { margin: 12vw 0 0;}
.carContent {font-size: 1.83vw;} 
.carContent .carImg {height: 40vw; }
.carInrCont {padding: 4.16vw 0 12vw; width: 90%; }
.carInrCont .carTtl {font-size: 2.3vw; margin-bottom: 3.3vw;}
.carInrCont h3 {font-size: 3.75vw; margin-bottom: 3.3vw;}

.carInrCont .linkMore a::before {width: 1.9vw; height: 1.72vw;}
	
}

/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
spSetting
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (max-width: 767px) {
img {width: 100%; height: auto;}

@media (orientation: portrait) { /* 縦 */
/* common  */
.homTitle{font-size: 11vw;}
.textBox p { font-size: 4.2vw;  }
.textBox p.fs-M {font-size: 7vw; line-height: 1.3; }
.textBox p.fs-L {font-size: 9vw; line-height: 1.3;}
.fadeIn { transform: translateY(10vw); }

/* header  */
#header {position: absolute;left: 0; top: 0; width: 100%; z-index: 5; display: flex; display: -webkit-flex; height: 13vw;}
#header .inrHeader {padding: 4vw;}
#header .inrHeader #hdLogo img {height: 5vw; width: auto;}


/* footer*/
#footer {padding: 20vw 0 4vw; font-size:4.2vw;}
#pagetop {margin-bottom: 8vw;}
#pagetop a::before {width: 6vw; height: 6vw;  top: -4vw; }
#linkCorp {margin-bottom: 10vw;}
#linkCorp  a {padding:  2vw 6vw; font-size: 5vw; }
.lgFooter {margin-bottom: 4vw;}
.lgFooter img {width: 40vw;}
.copy {font-size: 3.5vw;}
#external_link{margin-bottom: 10vw; display: block;}
#external_link span{width: 90%; font-size: 5vw; display: block; margin: 0 auto 5vw;}


/*navGlobal */
#btnGlobal {position: absolute;	width: 13vw;	height: 13vw;	right: 0;	top: 0;	z-index: 120;	background: #000;	display: flex;	display: -webkit-flex;	justify-content: center;	align-items: center;}
#btnGlobal .btnWrapGlobal {	position: relative;	width: 6vw;	height: 4.5vw;}
#btnGlobal .btnLine { height: 3px; background: #fff; position: absolute; right:0; width: 100%;}
#btnGlobal .btnLine.btnLineT {  top: 0;}
#btnGlobal .btnLine.btnLineM { top: 50%; transform: translateY(-50%);}
#btnGlobal .btnLine.btnLineB { bottom: 0; }
#btnGlobal.active .btnLine {background: #fff;}
#btnGlobal.active .btnLine.btnLineT { display: none;}
#btnGlobal.active .btnLine.btnLineM { transform: translateY(0) rotate(45deg) ;}
#btnGlobal.active .btnLine.btnLineB { transform: rotate(-45deg); bottom:inherit; top: 50%;}
#btnGlobal .btnLine.btnLineM, #btnGlobal .btnLine.btnLineB {-moz-transition: all, ease-in-out, 0.3s;  -o-transition: all, ease-in-out, 0.3s;  -webkit-transition: all, ease-in-out, 0.3s; transition: all, ease-in-out, 0.3s;}
#navGlobal {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); padding: 15vw 6vw 4vw; display: none; z-index: 5;}
#navGlobal  li a {display: block; margin: 1vw 0; padding: 2vw 0;}

/* visual */
#homVisual {height: 100vh; background-position: left top;}
#homVisual .homTxtVisual {transform: translateY(-25%);}
#homVisual .homTxtVisual h2 {font-size: 8vw; line-height: 1.4; }
#homVisual .homVisScroll {font-size: 4vw; bottom: 5vw;}
#homVisual .homVisScroll img {width: 4vw;}
#homVisual .homTxtVisual p {font-size: 5vw;}

/* catch */
#homCatch { padding: 10vw 0 0;}

/* message */
#message { margin: 14vw 0 0;}
.msgMovie {margin-bottom: 4vw;}
.msgName { font-size: 4.2vw;}

/* dx */
#dx  { margin: 12vw 0 0;}
.dxExample {margin-top: 10vw;}
.dxImg .dxPhoto {margin-bottom: 3vw;}
.dxImg p { font-size: 3.8vw; }
.dxTitle { margin: 6vw 0 4vw; font-size: 7vw;  }
.dxFlex .dxImg p { font-size: 3.2vw; }

/* workspace */
#workspace { margin: 12vw 0 0;}
.worksMovie {margin-bottom: 4vw;}
.worksName { font-size: 4.2vw;}

/* career */
#redruit { margin: 12vw 0 0;}
.carContent {width: 100%;  font-size:4.2vw;} 
.carContent .carImg {height: 50vw; }
.carInrCont {padding: 8vw 0; width: 90%;}
.carInrCont .carTtl {font-size: 5vw; margin-bottom: 4vw;}
.carInrCont h3 {font-size: 7vw; margin-bottom: 8vw;}
.carInrCont .linkMore a::before {width: 4.2vw; height: 3.8vw;}
}

@media (orientation: landscape) {/* 横 */

/* common   */
.homTitle{font-size: 12vw;}
.textBox p { font-size: 2rem;}
.textBox p.fs-M {font-size: 4.2rem; }
.textBox p.fs-L {font-size: 5.4rem;}

#btnGlobal {display: none;}
#header {padding: 4vw 0; position: absolute; left: 0; top: 0; width: 100%; z-index: 3;}
#header .inrHeader {font-family: 'Noto Sans JP', sans-serif; width: 90%; margin: 0 auto; display: flex; display: -webkit-flex; justify-content: flex-end; position: relative;}
#header .inrHeader #hdLogo { position: absolute; left: 0; top: 0; width:13vw; }
#header .inrHeader #navGlobal ul {display: flex; display: -webkit-flex; font-weight: 600;}
#header .inrHeader #navGlobal ul  li {margin:  0 1.25vw; font-size: 2vw;}

/* footer*/
#footer {padding: 100px 0 40px; }
#pagetop {margin-bottom: 40px;}
#linkCorp {margin-bottom: 60px;}
.lgFooter img {width: auto;}
#external_link{margin-bottom: 60px; width: 97%;}
#external_link span{font-size: 2.2vw; width: 32%;}

/* visual */
#homVisual {height: 100vh; background-position: left top;}
#homVisual .homTxtVisual h2 {font-size: 6vw;}
#homVisual .homTxtVisual h2 .pcNoDisplay {display: none;}
#homVisual .homVisScroll {font-size: 1.4rem; bottom: 15px;}
#homVisual .homVisScroll img {width: 15px;}
#homVisual .homTxtVisual p {font-size: 3vw;}

/* catch */
#homCatch { padding: 50px 0 0;}

/* message dx */
#message, #dx { margin: 70px 0 0;}
.dxTitle { margin:50px 0 20px; }
.dxFlex .dxImg p {font-size: 2.4vw;}

/* workspace */
#workspace{ margin: 60px 0 0;}
.slick-slide {width: 80vw;}
.slick-arrow {width: 50px; height: 50px;}
.slick-prev {margin-left: -40vw;}
.slick-next {margin-left: 40vw;}

/* career */
#redruit { margin: 60px 0 0;}
.carContent {font-size: 1.6rem;} 
.carContent .carImg {height: 240px; }
.carInrCont {padding: 30px 0; width: 90%;}
.carInrCont .carTtl {font-size: 2rem; margin-bottom: 10px;}
.carInrCont h3 {font-size: 4vw; margin-bottom: 20px;}

.carInrCont .linkMore a::before {width: 3.0vw; height: 2.6vw;}
}


}




/*top_mainCopy*/
.star1{
  -webkit-animation-duration: 1s;
  animation-delay:1s;
}
.star2{
  -webkit-animation-duration: 4s!important;
  animation-delay:3s;
}
.star3{
  -webkit-animation-duration: 1s!important;
  animation-delay:3s;
}
.star4{
  -webkit-animation-duration: 1s!important;
  animation-delay:4s;
}
.star5{
  -webkit-animation-duration: 1s!important;
  animation-delay:5s;
}
.star6{
  -webkit-animation-duration: 1s!important;
  animation-delay:6s;
}
.esyLate{
	-webkit-animation-duration: 1.9s!important;
}
.dx_main{
  -webkit-animation-duration: 1.9s!important;
  animation-delay:0.5s;
}
.dx_main2{
  -webkit-animation-duration: 1.9s!important;
    animation-delay:1.5s;
}
.dx_main3{
  -webkit-animation-duration: 1.9s!important;
    animation-delay:2.5s;
}
@keyframes blink{
    0% {opacity:0.3;}
    100% {opacity:1;}
}
.scroll_fade{
	animation:blink ease-in-out infinite alternate;
	-webkit-animation-duration: 2s!important;
}


/*
-webkit-animation-duration: 8s!important;
    animation-delay:2.5s;
*/


/*dxContent*/
.dx_name_box{width: 100%; background-color: #282828; margin: 0 auto; padding: 15px 0;}
.dx_name_box ul{position: relative; display: flex; display: -webkit-flex; justify-content: center; align-items: flex-start;}
/*#vol03 .dx_name_box ul,#vol04 .dx_name_box ul{align-items: flex-start!important;}*/


.dx_name_box ul li{margin-right: 80px; color: white; font-size: 1.8rem; text-align: center;}
.dx_name_box ul li:last-child{margin-right: 0;}
.dx_name_box ul li p{font-size: 2.6rem; display: block;}

.vol03 ul,.vol04 ul{width:70%; margin: 0 auto; max-width: 1050px;}
.vol03 ul li,.vol04 ul li{width:33%; margin-right: 0;}

#our_dx_contents{dsplay:block;}
#our_dx_contents h3 {text-align: center; margin:110px 0 15px; font-size: 6.5rem; font-weight: 300; border-bottom: 2px solid #fff;}
#our_dx_contents h3 p {font-size: 3.2rem;}

.dx_titleImage{width:100%;}
.dx_titleImage img{width:100%;}

.dxBig_img{margin: 0 0 80px 0; width: 100%;}
.dx_textBox{display: block; margin: 0 0 70px 0;}
.dx_textBox h4{margin: 0 0 75px 0; font-size: 3.0rem;}
.dx_textBox ul li{font-size: 2.2rem; line-height: 5.6rem; position: relative; padding-left: 75px; margin-bottom: 30px;}
.dx_textBox ul li span {position: absolute; left: 0; top: 0; letter-spacing: 0.5rem;}

#dx_list{dsplay:block; margin: 140px 0 0 0}
#dx_list h4 {text-align: center; margin:0 0 30px 0; font-size: 6.5rem; font-weight: 300;}
#dx_list ul {position: relative; display: flex; display: -webkit-flex; justify-content: center; align-items: center; flex-wrap: wrap;}
#dx_list ul li {box-sizing: border-box; width: 33.3%; margin-bottom: 50px;}
#dx_list ul li .dxPhoto {margin-bottom: 0; background: #fff; }
#dx_list ul li .dxPhoto img {border: 2px solid #fff; width: 100%;}
#dx_list ul li .dxImg p {margin-bottom: 15px;text-align: center; font-size: 2.2rem; font-family: 'Noto Sans JP', sans-serif;}

#askul_link{dsplay:block; margin: 140px 0 0 0; text-align: center;}
#askul_link p {margin-top: 15px;text-align: center; font-size: 2.2rem; font-family: 'Noto Sans JP', sans-serif;}

@media (max-width: 1200px) and (min-width: 768px) {
	#dx_list ul li .dxImg p {font-size: 1.83vw;}
	#askul_link p {font-size: 1.83vw;}	
}
@media (max-width: 1210px) {
#dx_list ul li {width: 30%;}
}
@media (max-width: 1200px) {
	#our_dx_Visual {background-position: center 8.3vw; min-height: 560px; padding: 8.3vw 0 0 0;}
}
@media (max-width: 1024px) {
	#our_dx_Visual {background-position: center 8.7vw; min-height: 560px; padding: 8.7vw 0 0 0;}
	.dx_name_box ul{width: 90%; margin: 0 auto;}
}
@media (max-width: 820px) {
	.dx_name_box ul{position: relative; display: block; width: 100%}
	.vol03 ul,.vol04 ul{width:100%;}
	.vol03 ul li,.vol04 ul li{width:100%;}
	.dx_name_box ul li{margin-right: 0; margin-bottom: 2.4vw; font-size: 3.4vw;}
	.dx_name_box ul li:last-child{margin-bottom: 0;}
	.dx_name_box ul li p{font-size: 3vw; margin-bottom: 0;}
	.pcNoDisplay{
		display:block!important;
	}
	.spNoDisplay{
		display:none!important;
	}
}
@media (max-width: 767px) {
	#our_dx_contents h3 {margin:50px 0 15px; font-size: 8vw;}
	#our_dx_contents h3 p {font-size: 6vw;}	
	.dxBig_img{margin: 0 0 9vw 0;}
	.dx_textBox{margin: 0 0 12vw 0;}
	.dx_textBox h4{margin: 0 0 6vw 0; font-size: 5vw;}
	.dx_textBox ul li{font-size: 3.8vw; line-height: 8vw; padding-left: 13.6vw; margin-bottom: 5vw;}
	#dx_list{margin: 80px 0 0 0}
	#dx_list ul {position: relative; display: block;}
	#dx_list ul li {margin-bottom: 14vw; width: 100%;}
	#dx_list h4 {font-size: 8vw;}
	#our_dx_Visual h2 {width: 90%; margin: 0 auto;}
	#our_dx_Visual h2 p{font-size: 4.0vw; margin: 0 0 1vw 0;}
	#askul_link{margin: 70px 0 0 0;}
	@media (orientation: portrait) { /* 縦 */
		#dx_list ul li .dxImg p {font-size: 3.8vw;}
		#askul_link p {font-size: 3.8vw;}
		#our_dx_Visual {min-height: 320px; padding: 13.0vw 0 0 0;}
		.our_dx_Visual_spedial {background-position: 45% 13.0vw!important; background-size: cover;}
		.our_dx_Visual_vol01 {background-position: center 13.0vw!important; background-size: cover;}
		/*.our_dx_Visual_vol02 {background-position: 58% 13.0vw!important; background-size: cover;}*/
		
		.our_dx_Visual_vol02 {background-image: url("../img/our_dx/bg-mainVisual-03_sp.jpg"); background-position: 0 13.0vw!important;}
		.our_dx_Visual_vol03 {background-image: url("../img/our_dx/bg-mainVisual-04_sp.jpg"); background-position: 0 13.0vw!important;}
		.our_dx_Visual_vol04 {background-image: url("../img/our_dx/bg-mainVisual-05_sp.jpg"); background-position: 0 13.0vw!important;}
}
	@media (orientation: landscape) {/* 横 */
		#dx_list ul li .dxImg p {font-size: 2.4vw;}
		#askul_link p {font-size: 2.4vw;}
		#our_dx_Visual {background-position: center 10.4vw; min-height: 400px; padding: 10.4vw 0 0 0;}
}
}




.nowText{font-size: 2.2rem; margin-bottom:55px; text-align: center;}
@media (max-width: 767px) {
.nowText{font-size: 3.2vw; margin-bottom:7vw;}	
}