@charset "UTF-8";
/* CSS Document */
html, body{width:100%; height:100%; position:relative; overflow:hidden;}
a[href^="tel:"]{pointer-events:none;}

/*header*/
h1{position:fixed; top: 115px; left: 15px; width: 150px; line-height:0; z-index:1000;
transform:translateY(-100px);
transition:all 1s ease-in-out;}
h1.show{transform:translateY(0); -webkit-transform:translateY(0);}

/*Contact-button*/
#contact .cont {
  position: fixed;
  bottom: -80px;
    right: 15px;
    width: 90px;
  line-height: 0;
  z-index: 1000;
  transform: translateY(-100px);
  transition: all 1s ease-in-out;
}

#btn-menu{position:fixed; top: 15px; right: 15px; width:36px; height:32px; z-index:1000; overflow:hidden; cursor:pointer;}
#btn-menu span{width:100%; height:2px; background:#fff; position:absolute; top:0; left:0;
transition:all .3s ease; -webkit-transition:all .3s ease;}
#btn-menu span:nth-of-type(2){top:15px; left:-50%;}
#btn-menu span:nth-of-type(3){top:15px; left:50%;}
#btn-menu span:nth-of-type(4){top:30px;}

#btn-menu.open span{background:#464646;}
#btn-menu.open span:nth-of-type(1){
-webkit-transform: translateY(15px) translateX(0) rotate(45deg);
        transform: translateY(15px) translateX(0) rotate(45deg);}
#btn-menu.open span:nth-of-type(2){
-webkit-transform: translateX(-100%);
        transform: translateX(-100%);}
#btn-menu.open span:nth-of-type(3){
-webkit-transform: translateX(100%);
        transform: translateX(100%);}
#btn-menu.open span:nth-of-type(4){
-webkit-transform: translateY(-15px) translateX(0) rotate(-45deg);
        transform: translateY(-15px) translateX(0) rotate(-45deg);}

#menu{background-color:rgba(255,255,255,.9); position:fixed; top: 15px; right: 15px; width:400px; z-index:-1; opacity:0;
transition:all 0.5s; -webkit-transition:all 0.5s;}
#menu ul{padding:6% 8%;}
#menu li{font-size:20px; margin:0 0 4%;
font-family:Gotham, 'Gotham', 'Montserrat', 'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
transform-origin: left bottom;
transform: scaleY(0); -webkit-transform: scaleY(0);
transition: transform .9s cubic-bezier(.19,1,.22,1) .5s;
-webkit-transition: transform .9s cubic-bezier(.19,1,.22,1) .5s;}
#menu li:last-of-type{margin:0;}
#menu li span{margin:0 0 0 2.5em; font-size:11px; display:inline-block;
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, Arial, Helvetica, Verdana, sans-serif;}

#menu li a{position:relative; pointer-events:none; display:inline-block;}
#menu li a:before{content:''; position:absolute; top:0; left:0; height:100%; width:0; background:#f2f2f2; display:block; z-index:-1;
transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
#menu li.active a:before,
#menu li a:hover:before{width:100%;}
#menu.open{opacity:1; z-index:999;}
#menu.open li{opacity:1; transform:scaleY(1); -webkit-transform:scaleY(1);}
#menu.open li a{pointer-events:auto;}
/*header*/

.main-slider{height:100%; width:100%;}
.swiper-slide{background:#c7c8c9; width:100%; height:100%; position:relative;}

.inner{position:absolute; top:50%; left:5%; right:5%; width:90%; margin:0 auto; transform:translateY(-50%); -webkit-transform:translateY(-50%);}
h2{margin:0 0 40px; opacity:0; transition:opacity 0.5s ease-in-out 0.8s; -webkit-transition:opacity 0.5s ease-in-out 0.8s;}
h2 svg{stroke:rgba(1,1,1,0); stroke-width:1; stroke-dasharray:130; stroke-dashoffset:0; fill:#010101; width:100%;}

.btn-scroll{position:absolute; bottom:50px; left:0; right:0; margin:0 auto; width:60px; height:60px; background:#fff; border-radius:100%; z-index:10; display:block; cursor:pointer; text-indent:-999px;}
.btn-scroll:before{position:absolute; top:23px; left:23px; content:''; border:solid #333; border-width:0 1px 1px 0; display:block; padding:6px; transform:rotate(45deg);  -webkit-transform:rotate(45deg);}
.btn-scroll:hover{opacity:.7;}

.inner.anime h2{opacity:1;}
.inner.anime h2 svg{animation: a-top-svg 2.5s linear; -webkit-animation: a-top-svg 2.5s linear;}
@keyframes a-top-svg{
0%{fill:rgba(1,1,1,0); stroke:#010101; stroke-dashoffset:130;}
40%{fill:rgba(1,1,1,0); stroke:#010101; stroke-dashoffset:130;}
80%{fill:rgba(1,1,1,0); stroke:#010101; stroke-dashoffset:0;}
100%{fill:#010101; stroke:rgba(1,1,1,0); stroke-dashoffset:0;}
}

@-webkit-keyframes a-top-svg{
0%{fill:rgba(1,1,1,0); stroke:#010101; stroke-dashoffset:130;}
40%{fill:rgba(1,1,1,0); stroke:#010101; stroke-dashoffset:130;}
80%{fill:rgba(1,1,1,0); stroke:#010101; stroke-dashoffset:0;}
100%{fill:#010101; stroke:rgba(1,1,1,0); stroke-dashoffset:0;}
}

/* MV */
#mv{overflow:hidden; background:#fff;}
#mv:before{background:url(../../images/dot.png); position:absolute; top:0; left:0; width:100%; height:100%; content:''; z-index:2;}
#mv.show2:before{background:url(../../images/dot2.png);}
#mv .video{position:absolute; top:50%; left:50%; width:auto; height:auto; min-width:100%; min-height:100%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); opacity:0;}
#mv #video1{z-index:1; min-height:130%;}
#mv #video2{z-index:0;}

#mv .label{position:absolute; top:4%; right:2%; font-size:16px; font-weight:bold; z-index:10; letter-spacing:0.1em;}
#mv .cont{position:absolute; top:50%; left:0; right:0; margin:0 auto; width:776px; z-index:10; transform:translateY(-50%); -webkit-transform:translateY(-50%);}
#mv h1{display:none; position:absolute; top:72%; left:0; right:0; margin:0 auto; width:67.5%; z-index:10; text-align:center;}
#mv .txt{position:relative;}
#mv .txt:after{position:absolute; top:0; left:4.5%; height:100%; width:0; background:#fff; content:''; z-index:-1; transition:all 1s; -webkit-transition:all 1s;}
#mv .txt.show:after{width:68.7%;}
#mv .line{margin:0 0 0 4.5%; background:url(../../images/line.png) repeat-x left bottom; background-size:auto 100%; text-align:right; width:60px; transition:all 1s; -webkit-transition:all 1s;}
#mv .line.show{width:95.5%;}
#mv .txt, #mv .line{opacity:0;}

#news{position:absolute; bottom:5px; left:0; right:0; margin:0 auto; width:100%; z-index:10; }
#news li{text-align:center;}
#news li a{position:relative; padding:0 0 0 100px; display:inline-block;}
#news li p{padding:7px 0; font-size:14px; line-height:1.3; letter-spacing:0.1em;}
#news li p:nth-of-type(1){width:100px; position:absolute; top: -8px; left:0px;}

.show-txt #news li{color:#fff;}
.show-txt .label{color:#fff;}

/* COMMON */


/* NEWS INDEX */
#news_in h2{width:200px;}
#news_in h3{font-size: 15px; font-weight: 900;}
#news_in .inner{max-width:860px;}
#news_in .info{opacity:0; transition:opacity 1s ease-in-out 0.8s; -webkit-transition:opacity 1s ease-in-out 0.8s;}
#news_in .wrap{display: flex;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;-ms-flex-wrap: wrap;flex-wrap: wrap;justify-content: space-between;}
#news_in .cont4{width:100%; max-width:410px; height: 360px; margin:0 auto 0 0; background:#fff; padding:3% 3% 2%;}
#news_in .cont5{width:100%; max-width:410px; height: 360px; margin:0 0 20px auto; background:#fff; padding:3% 3% 2%;}
#news_in time {font-size: 14px; color: #888888; letter-spacing: 0.01em;}
#news_in p {text-align: right;}
#news_in p img {width: 16%;}

#news_in .anime .info{opacity: 1;}

/* brand common */
/*=== 画像の表示エリア ================================= */
.slide {
  position   : relative;
  overflow   : hidden;
                    /* 画像のサイズに合わせて変更ください */
  width      : 420px;
  height     : 420px;
  margin     : auto;      /* サンプルは中央寄せの背景：白 */
  background : #c6c7c8;
}
 
 /*=== 画像の設定 ======================================= */
.slide img {
  display    : block;
  position   : absolute;
                      /* 画像のサイズを表示エリアに合せる */
  width      : inherit;
  height     : inherit;
  opacity    : 0;
  animation  : slideAnime 20s ease infinite;
}
 
 /*=== スライドのアニメーションを段差で開始する ========= */
.slide img:nth-of-type(1) { animation-delay: 0s }
.slide img:nth-of-type(2) { animation-delay: 5s }
.slide img:nth-of-type(3) { animation-delay: 10s }
.slide img:nth-of-type(4) { animation-delay: 15s }

 
 /*=== スライドのアニメーション ========================= */
@keyframes slideAnime{
   0% { opacity: 0 }
   6% { opacity: 1 }
  19% { opacity: 1 }
  25% { opacity: 0 }
 100% { opacity: 0 }
}

/*=== 画像の表示エリア ================================= */
.slide2 {
  position   : relative;
  overflow   : hidden;
                    /* 画像のサイズに合わせて変更ください */
  width      : 420px;
  height     : 420px;
  margin     : auto;      /* サンプルは中央寄せの背景：白 */
  background : #c6c7c8;
}
 
 /*=== 画像の設定 ======================================= */
.slide2 img {
  display    : block;
  position   : absolute;
                      /* 画像のサイズを表示エリアに合せる */
  width      : inherit;
  height     : inherit;
  opacity    : 0;
  animation  : slideAnime 25s ease infinite;
}
 
 /*=== スライドのアニメーションを段差で開始する ========= */
.slide2 img:nth-of-type(1) { animation-delay: 0s }
.slide2 img:nth-of-type(2) { animation-delay: 5s }
.slide2 img:nth-of-type(3) { animation-delay: 10s }
.slide2 img:nth-of-type(4) { animation-delay: 15s }
.slide2 img:nth-of-type(5) { animation-delay: 20s }

 
 /*=== スライドのアニメーション ========================= */
@keyframes slide2Anime{
   0% { opacity: 0 }
   6% { opacity: 1 }
  19% { opacity: 1 }
  25% { opacity: 0 }
 100% { opacity: 0 }
}


/* BRAND1 */
#brand1 h2{width:240px;}
#brand1 h3{font-size: 16px; font-weight: 800;}
#brand1 .btn-scroll{bottom:2%;}
#brand1 .inner{max-width:860px;}
#brand1 .info{opacity:0; transition:opacity 1s ease-in-out 0.8s; -webkit-transition:opacity 1s ease-in-out 0.8s;}
#brand1 .shop{width:40%; float:left; font-size:15px; line-height:2.2; }
#brand1 .shop p{margin:0; line-height:1.8;}
#brand1 .shop table p {font-size: 10px; margin: -10px 0 5px; line-height:2.2;}
#brand1 .shop table p img{width: 50px;}
#brand1 .map{height: 150px;}

#brand1 .pc{display: block; float: right; padding-top: 18px;}
#brand1 .sp{display: none;}
/*#brand1 ul{width: 420px; float: right; opacity:0; transition:opacity 1s ease-in-out 0.8s; -webkit-transition:opacity 1s ease-in-out 0.8s;}*/

#brand1 .anime .info{opacity:1;}
/*#brand1 .anime ul{opacity:1;}*/

#brand1 .shop .URL a{position:relative; z-index:1;}
#brand1 .shop .URL a:before{content:''; width:0; left:0; top:0; height:100%; position:absolute; background:#BBBBBB; z-index:-1;
transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
#brand1 .shop .URL a:hover:before{width:100%;}
#brand1 .shop .URL a.un:hover:before{display:none;}

#brand1 .shop .insta a{}

/* BRAND2 */
#brand2 h2{width:240px;}
#brand2 h3{font-size: 16px; font-weight: 800;}
#brand2 .btn-scroll{bottom:2%;}
#brand2 .inner{max-width:860px;}
#brand2 .info{opacity:0; transition:opacity 1s ease-in-out 0.8s; -webkit-transition:opacity 1s ease-in-out 0.8s;}
#brand2 .shop{width:40%; float:right; font-size:15px; line-height:2.2; margin-top: -14px;}
#brand2 .shop p{margin:0; line-height:1.8;}
#brand2 .shop table p {font-size: 10px; margin: -10px 0 5px; line-height:2.2;}
#brand2 .shop table p img{width: 50px;}
#brand2 .map{height: 150px;}

#brand2 .pc{display: block; float: left; padding-top: 20px;}
#brand2 .sp{display: none;}
/*#brand2 ul{width: 420px; float: left; opacity:0; transition:opacity 1s ease-in-out 0.8s; -webkit-transition:opacity 1s ease-in-out 0.8s; margin-top: 20px;}*/

#brand2 .anime .info{opacity:1;}
/*#brand2 .anime ul{opacity:1;}*/

#brand2 .shop .URL a{position:relative; z-index:1;}
#brand2 .shop .URL a:before{content:''; width:0; left:0; top:0; height:100%; position:absolute; background:#BBBBBB; z-index:-1;
transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
#brand2 .shop .URL a:hover:before{width:100%;}
#brand2 .shop .URL a.un:hover:before{display:none;}

#brand2 .shop .insta a{}

/* awards */
#awards .inner{max-width:860px;}
#awards .info{opacity:0; transition:opacity 1s ease-in-out 0.8s; -webkit-transition:opacity 1s ease-in-out 0.8s;}
#awards .pc{display: block;}
#awards .sp{display: none;}

#awards .anime .info{opacity: 1;}

/* EC */
#EC .inner{max-width:860px;}
#EC .info{opacity:0; transition:opacity 1s ease-in-out 0.8s; -webkit-transition:opacity 1s ease-in-out 0.8s;}
#EC .box{width:100%; background:#fff; padding:3% 3% 2%;}
#EC .box h3{font-size: 15px;}
#EC p img{width: 25%; margin: 20px 0 0;}
#EC .box2{text-align: right;}

#EC .anime .info{opacity: 1;}

/* BRAND3 */
#brand3 h2{width:240px;}
#brand3 h3{font-size: 16px; font-weight: 800;}
#brand3 .btn-scroll{bottom:2%;}
#brand3 .inner{max-width:860px;}
#brand3 .info{opacity:0; transition:opacity 1s ease-in-out 0.8s; -webkit-transition:opacity 1s ease-in-out 0.8s;}
#brand3 .shop{width:40%; float:left; font-size:15px; line-height:2.2;}
#brand3 .shop p{margin:0; line-height:1.8;}
#brand3 .shop table p {font-size: 10px; margin: -10px 0 5px; line-height:2.2;}
#brand3 .shop table p img{width: 50px;}
#brand3 .map{height: 150px;}

#brand3 .pc{display: block; float: right; padding-top: 53px;}
#brand3 .sp{display: none;}
/*#brand3 ul{width: 420px; float: right; opacity:0; transition:opacity 1s ease-in-out 0.8s; -webkit-transition:opacity 1s ease-in-out 0.8s; margin-top: 20px;}*/

#brand3 .anime .info{opacity:1;}
/*#brand3 .anime ul{opacity:1;}*/

#brand3 .shop .URL a{position:relative; z-index:1;}
#brand3 .shop .URL a:before{content:''; width:0; left:0; top:0; height:100%; position:absolute; background:#BBBBBB; z-index:-1;
transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
#brand3 .shop .URL a:hover:before{width:100%;}
#brand3 .shop .URL a.un:hover:before{display:none;}

#brand3 .shop .insta a{}


/* Access */
#access h2{width:305px;}
#access .btn-scroll{bottom:2%;}
#access .inner{max-width:860px;}
#access .info{width:40%; float:left; font-size:15px; line-height:1.8; opacity:0; transition:opacity 1s ease-in-out 0.8s; -webkit-transition:opacity 1s ease-in-out 0.8s;}
#access .info p{margin: 0 0 30px; line-height: 1.8; font-size: 18px; font-weight: 800;}
#access .map{width:55%; float:right; opacity:0; transition:opacity 1s ease-in-out 1s; -webkit-transition:opacity 1s ease-in-out 1s;}

#access .anime .map{opacity:1;}
#access .anime .info{opacity:1;}

#access a{position:relative; z-index:1;}
#access a:before{content:''; width:0; left:0; top:0; height:100%; position:absolute; background:#BBBBBB; z-index:-1;
transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
#access a:hover:before{width:100%;}
#access a.un:hover:before{display:none;}

/* Access2 */
#access2 h2{width:205px;}
#access2 .btn-scroll{bottom:2%;}
#access2 .inner{max-width:860px;}
#access2 .info{width:40%; float:left; font-size:15px; line-height:1.8; opacity:0; transition:opacity 1s ease-in-out 0.8s; -webkit-transition:opacity 1s ease-in-out 0.8s;}
#access2 .info p{margin:0 0 40px; line-height: 1.8; font-size: 18px; font-weight: 800;}
#access2 .map{width:55%; float:right; opacity:0; transition:opacity 1s ease-in-out 1s; -webkit-transition:opacity 1s ease-in-out 1s;}

#access2 .anime .map{opacity:1;}
#access2 .anime .info{opacity:1;}

#access2 .map .top_btn{text-align: right;}
#access2 .map .top_btn img{width: 60px; padding-top: 20px;}


/* Company Profile*/
#company .inner{max-width:980px;}
#company h2{width:340px; position:absolute; top:50%; left:0; transform:translateY(-50%); -webkit-transform:translateY(-50%);}
#company h2 svg.sp{display:none;}
#company .profile{padding:0 0 0 48%; font-size:12px; line-height:2; opacity:0; transition:opacity 1s ease-in-out 0.8s; -webkit-transition:opacity 1s ease-in-out 0.8s;}
#company table{width:100%;}
#company tr{vertical-align:top;}
#company th{width:122px; text-align:right; padding:0 10px 25px 0;}
#company td{padding:0 0 25px;}
#company td p{padding:0 0 25px;}
#company td p:last-of-type{padding:0;}
#company tr.nopad th{padding:0 10px 0 0;}
#company tr.nopad td{padding:0;}

#company .anime .profile{opacity:1;}

#company a{position:relative; z-index:1;}
#company a:before{content:''; width:0; left:0; top:0; height:100%; position:absolute; background:#BBBBBB; z-index:-1;
transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
#company a:hover:before{width:100%;}
#company a.un:hover:before{display:none;}


/* ----------- MEDIA ----------- */
@media screen and (max-width:1366px) {
.btn-scroll{width:40px; height:40px;}
.btn-scroll:before{top:12px; left:13px;}

#mv .label{top:20px; right:20px; font-size:14px;}
#mv .cont{width:600px;}

}

@media screen and (max-width:1024px) {
#news_in .cont4{max-width: 410px; height: 360px;}
#news_in .cont5{max-width: 410px; height: 360px;}	
#news_in p img{width: 30%;}

/* brand common */
/*=== 画像の表示エリア ================================= */
.slide {
                    /* 画像のサイズに合わせて変更ください */
  width      : 390px;
  height     : 390px;
}

#brand1 h3{font-size: 17px;}
#brand1 .map{height: 100px;}
#brand1 ul{width:400px; padding-top:47px;}
#brand1 .pc{padding-top: 0; margin-top: -10px;}
#brand1 .shop .insta a{border-bottom: none;}

#brand2 h3{font-size: 17px;}
#brand2 .info{padding-top: 44px;}
#brand2 .map{height: 100px;}
#brand2 ul{width:400px; padding-top: 35px;}
#brand2 .pc{padding-top: 32px;}
#brand2 .shop .insta a{border-bottom: none;}
	
#EC p img {width: 38%;}
#EC .box h3 {font-size: 3.4vw;}

#awards .pc{display: block;}
#awards .sp{display: none;}

#brand3 h3{font-size: 17px;}
#brand3 .map{height: 100px;}
#brand3 ul{width:400px; padding-top: 25px;}
#brand3 .pc{padding-top: 77px;}
#brand3 .shop .insta a{border-bottom: none;}
}

@media screen and (max-width:1000px) {
#mv .cont{width:80%;}
#mv .line, #mv .line img{width:4.7vw; line-height:0;}

#access h2{width:26vw;}
	
#access2 h2{width:130px;}

#company h2{width:29vw;}
#company .profile{padding:0 0 0 45%;}
}

@media screen and (max-width:768px) {
#news_in .cont4{max-width: 320px; height: 320px; line-height: 1.5;}
#news_in .cont5{max-width: 320px; height: 320px; line-height: 1.5;}	
	
#brand1 .pc{margin-top: 57px;}
#brand1 .shop table p{font-size: 10px;}

#brand2 .pc{padding-top: 49px;}
#brand2 .shop table p{font-size: 10px;}	
	
#brand3 .pc{padding-top: 90px;}
#brand3 .shop table p{font-size: 10px;}

@media screen and (max-width:767px) { 
a[href^="tel:"]{pointer-events:auto;}
h2{margin:0 0 3vh;}
	
#menu {width: calc(100% - 50px);}
#menu li {font-size: 4vw;}

#news_in h2 {width: 93px;}
#news_in h3 {font-size: 3.4vw; font-weight: 900;}
#news_in .cont4 {width: 100%;  max-width: 100%; padding: 7% 8% 6%; float: none;}
#news_in .cont5{display: none;}
#news_in time {font-size: 3.3vw;}
#news_in p img {width: 35%;padding-top: 15px;}

#access h2{width:calc(12vw + 12vh);}
	
#access2 h2{width:80px;}
	
/* brand common */
/*=== 画像の表示エリア ================================= */
.slide {
  position   : relative;
  overflow   : hidden;
                    /* 画像のサイズに合わせて変更ください */
  width      : 338px;
  height     : 200px;
  margin     : auto;      /* サンプルは中央寄せの背景：白 */
  background : #c6c7c8;
}
	
#brand1 h2{width: 107px; margin: 30px 0 10px;}
#brand1 h3{font-size: 4.3vw;}
#brand1 .inner{top: 49%;}
#brand1 .shop{width: 100%; float: none;}
#brand1 .shop p{font-size: 3.4vw;}
#brand1 .map{height: 100px;}
#brand1 .pc{display: none;}
#brand1 .sp{display: block;}
#brand1 ul{width: 100%; float: none;}
	
#brand2 h2{width: 107px;}
#brand2 h3{font-size: 4.3vw;}
#brand2 .info{padding-top: 0;}
#brand2 .inner{margin-top: 5px;}
#brand2 .shop{width: 100%; float: none;}
#brand2 .shop p{font-size: 3.4vw;}
#brand2 .map{height: 100px;}
#brand2 .pc{display: none;}
#brand2 .sp{display: block;}
#brand2 ul{width: 100%; float: none; margin-top: 0;}
	
#brand3 h2{width: 107px;}
#brand3 h3{font-size: 4.3vw;}
#brand3 .inner{top: 51%;}
#brand3 .shop{width: 100%; float: none;}
#brand3 .shop p{font-size: 3.4vw;}
#brand3 .map{height: 100px;}
#brand3 .pc{display: none;}
#brand3 .sp{display: block;}
#brand3 ul{width: 100%; float: none; margin-top: 0;}
	
#company h2{width:calc(14vw + 14vh);}
#company th{width:32%; padding:0 3% 1vh 0;}
#company td{padding:0 0 1vh;}
#company td p{padding:0 0 1vh;}
#company tr.nopad th{padding:0 3% 0 0;}
}

@media screen and (max-width:480px) { 
#news_in .cont4 {width: 100%; max-width: 100%; height: auto; padding: 3% 3%; float: none;}
#news_in .cont5{display: none;}
	
.slide {
  position   : relative;
  overflow   : hidden;
                    /* 画像のサイズに合わせて変更ください */
  width      : 100%;
  height     : 200px;
  margin     : auto;      /* サンプルは中央寄せの背景：白 */
  background : #c6c7c8;
}
	
#EC p img {width: 60%;}

#awards .pc{display: none;}
#awards .sp{display: block;}

#access2 .map .top_btn {
  text-align: left;
}
}

/* Portrait */
@media only screen and (min-device-width: 100px) and (max-device-width: 767px) and (orientation: portrait) {
#mv .label{font-size:2.8vw; top:10px; right:10px;}

#access .info{width:100%; float:none; font-size:3.4vw; margin:0 0 6vh;}
#access .info p{margin:0 0 2vh;}
#access .map{width:100%; float:none;}
#access .map iframe{height:calc(10vw + 20vh);}
	
#access2 .info{width:100%; float:none; font-size:3.4vw; margin:0 0 6vh;}
#access2 .info p{margin:0 0 2vh;}
#access2 .map{width:100%; float:none;}
#access2 .map iframe{height:calc(10vw + 20vh);}

#company h2{width:calc(28.5vw + 28.5vh); position:static; transform:translateY(0); -webkit-transform:translateY(0);}
#company h2 svg.pc{display:none;}
#company h2 svg.sp{display:block;}
#company .profile{padding:0; font-size:3.15vw; line-height:1.7;}
}

/* Landscape */
@media only screen and (min-device-width: 100px) and (max-device-width: 767px) and (orientation: landscape) {
#mv .label{font-size:calc(1vw + 1vh);}
#mv .cont{width:calc(30vw + 30vh);}
#mv h1{width:calc(22.8vw + 22.8vh);}
#mv .line, #mv .line img{width:calc(1.5vw + 1.5vh);}

#access .info{font-size:calc(1.2vw + 1vh);}
#access .info p{margin:0 0 3vh;}
#access .map iframe{height:calc(14vw + 24vh);}
	
#access2 .info{font-size:calc(1.2vw + 1vh);}
#access2 .info p{margin:0 0 3vh;}
#access2 .map iframe{height:calc(14vw + 24vh);}

#company .profile{font-size:calc(0.9vw + 1vh); line-height:1.5;}
}