@charset "utf-8";
html, body {
  height: 100%;
  -webkit-text-size-adjust: 100%;
}
body {	
  background-color: #fff;
  color: #000;
  font: 500 14px/1.7 'Hiragino Mincho ProN', 'YuMincho', 'MS 明朝', 'Times New Roman', serif;
}
.sans {
  font-weight: 500; 
  line-height:1.7;
  font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN','メイリオ', sans-serif;
}
.all {/*スマホの横揺れ禁止*/
  overflow: hidden;
}
.container {
  margin: 0 auto; 
  max-width: 1200px;
}
@media only screen and (max-width: 1220px){  

.container {
  margin: 0 auto;
  width: 98%;
}

}
a {
  color: #000;
  text-decoration: none;
}
a:link {
  color: #000;
  text-decoration: none;
}
a:hover {/*マウスをのせたとき*/
  opacity: .8;
  text-decoration: none;
}
a:hover img {
  opacity: .8;
}
.photo-fit img {
  object-fit: cover;
  height: 100%;
}
.w100 {
  width: 100%;
}
.w50 {
  width: 50%;
}
.w60 {
  width: 60%;
}
.w40 {
  width: 40%;
}
.w33 {
  width: calc(100% / 3) ;
}
.w66 {
  width: calc(100% / 3 * 2) ;
}
.w30 {
  width: 30%;
}
.w25 {
  width: 25%;
}
.w36{
  width: 36%;
}
.w90 {
  width: 90%;
}
.w55 {
  width: 55%;
}
.w45 {
  width: 45%;
}
.w75 {
  width: 75%;
}
.w60f {
  width: 60%;
}
/*////////////color////////*/
.red {
  color: #d82a20;
}
.bg-red {
  background-color: #d82a20;
}
.bd-red {
  border: 1px solid #d82a20;
}
.dark-red {
  color: #a32225;
}
.bg-dark-red {
  background-color: #a32225;
}
.blue {
  color: #1a2d78;
}
.bg-blue {
  background-color: #1a2d78;
}
.purple {
  color: #9595c5;
}
.bg-purple {
  background-color: #9595c5;
}
.gray {
  color: #d2d1e3;
}
.bg-gray {
  background-color: #d2d1e3;
}
.bd-black {
  border: 1px solid #000;
}
h1 img, h2 img, figure img {
  width: 100%;
}
.upper {
  height: calc(100% - 20px);
  padding: 0 4%;
}
.cap {
 /*height: 30px;*/
  margin-top: -20px;
  padding: 0 4%;
}
/*////////////color=END=////////*/
/*///////////////////////////nav/////////////////////*/
header {
  border: 1px solid #000;
}
header h1 {
  border-top: 1px solid #000;
}
header nav {
  border-right: 1px solid #000;
}
header nav li {
  border-top: 1px solid #000;
  padding:2px 0 1px 0;
}
header nav li span {
  margin-left: 10px;
}
header nav li:hover {
  background:#9595c5;
}
header nav li:hover span {
  color:#fff;
  /*font-weight: bold;*/
}
header nav li:first-child:hover {
  background:#fff;
}
header nav li a:hover {
  opacity: 1;
}
header nav li.advance-notice, header nav li.advance-notice2 {
  position: relative;
}
header nav li.advance-notice::after, header nav li.advance-notice2::after  {
  content: "";
  position: absolute;
  left: 50%;
  top: -20px;
}
header nav li.advance-notice:hover, header nav li.advance-notice:hover span, header nav li.advance-notice2:hover, header nav li.advance-notice2:hover span {
  color:#9595c5;
}
header nav li.advance-notice:hover:after {
  content: "2023年1月中旬スタート";
  display: block;
  position: absolute;
  top: 2px;
  color: #000;
  left:calc(50% - 80px);
}
header nav li.advance-notice2:hover:after {
  content: "2023年春公開予定";
  display: block;
  position: absolute;
  top: 2px;
  color: #000;
  left:calc(50% - 60px);
}
/*///////////////////////nav=END=/////////////////////*/
/*//////////////////////////top&common/////////////////////*/
header.top {
  border: none;
}
.top.slide {
  position: fixed;
  top:10px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
}
.top .rslides img {
  width: 100%;
}
main.top {
  position: relative; 
  top:0;
}
.top .top-container {
  width: 90%;
  margin: 0 auto;
}
.top .top-gif {
}
.top .top-nav {
  margin-top: 30px;
}
.top .top-nav figure {
    margin-bottom: 30px;
}
.top .my {
  margin: 30px 0;
}
.top .start-jan {
  position: relative;
}
.top .start-jan img:hover {
  opacity: .8;
}
.top .start-jan:hover:after {
  content: "2023年1月中旬スタート";
  display: block;
  position: absolute;
  color: #000;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  margin: auto;
  font-weight: bold; 
  line-height:1.7;
  font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN','メイリオ', sans-serif;
  font-size: 21px;
  width: 100%;
  text-align: center;
}
.top .start-jan2 {
  position: relative;
}
.top .start-jan2 img:hover {
  opacity: .8;
}
.top .start-jan2:hover:after {
  content: "2023年1月中旬スタート";
  display: block;
  position: absolute;
  color: #fff;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  margin: auto;
  font-weight: bold; 
  line-height:1.7;
  font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN','メイリオ', sans-serif;
  font-size: 21px;
  width: 100%;
  text-align: center;
}
.top .start-spring {
  position: relative;
}
.top .start-spring img:hover {
  opacity: .8;
}
.top .start-spring:hover:after {
  content: "2023年春公開予定";
  display: block;
  position: absolute;
  color: #000;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  margin: auto;
  font-weight: bold; 
  line-height:1.7;
  font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN','メイリオ', sans-serif;
  font-size: 21px;
  width: 100%;
  text-align: center;
}
.top .link-official a {
  display: block;
  background-color: lightgray;
 }
 .top .link-official a:hover {
  background-color: rgba(149, 149, 197, .8);
 }
.top .link-official span {
 color: #fff;
 font-weight: bold;
 margin-left: 10px;
}
/*///////////////////////top&common=END=/////////////////////*/
/*///////////////////////////other pages/////////////////////*/
/*about*/
.movie {
  border-right: 1px solid #000;
  background: #000;
  padding: 10px;
}
video {
    aspect-ratio: 1 / 1;
    width: 100%;
}
.f-right {
  float:right;
}
.clear {
  clera:both;
}
.about .about1 {
  padding: 30px 0;
  border-left: 1px solid #000;
  border-right: 1px solid #000;
}
.about .about2 {
  border: 1px solid #000;
}
.about .about2 .michel-box {
  background: #101010;
}
.about .about2 .michel-box figure {
  padding-top: 50px;
}
.about .about2-right {
  margin-right: 2%;
  padding: 30px 0;
}
.about .about2 .bd-1 {
  border-top: 1px solid #000;
  border-right: 1px solid #000;
}
.about .about2 .bd-2 {
  border-top: 1px solid #000;
}
.about .about3 {
  padding-top: 30px;
  border-left: 1px solid #000;
  border-right: 1px solid #000;
}
.about .about3 h2 {
  margin-bottom: 20px;
}
.about .about3 h3 {
  line-height: .8em;
  margin-bottom: 15px;
}
.about .about3-box {
  padding: 20px 30px;
}
.about .about3-box figcaption{
  padding-top: 10px;
  line-height: 1.4em;
}
.about .about3-box1 {
  border-top: 1px solid #000;
}
.about .about3-box .about3-wphoto{
  margin-left: 20%;
}
.about .about3-box .min-w {
  min-width: 90px;
}
.about .about3-box .m27f {
  margin-left:36.5%;
}
.about .about3-box .m30f {
  margin-left: 35%;
}
.about .about3-box .m42f {
  margin-left: 26%;
}
.about .about3-box2 {
  border-left: 1px solid #000;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
}
.about .about3-box3 {
  border-top: 1px solid #000;
}
.about .about3-box4 {
  border-top: 1px solid #000;
 border-bottom: 1px solid #000;
}
.about .about3-box5 {
  border-left: 1px solid #000;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
 border-bottom: 1px solid #000;
}
.about .about3-box6 {
  border-top: 1px solid #000;
 border-bottom: 1px solid #000;
}
.about .about3-box6 .spec{
  border-top: 1px solid #000;
}
.about .about3-box .w27f{
  width: 27%;
}
.about .about3-box .w22f{
  width: 22%;
}
.about .about3-box .w57f{
  width: 57%;
}
.about .about3-box .w30f{
  width: 30%;
}
.about .about3-box .w42f{
  width: 42%;
}
.about .about3-box .w55f{
  width: 55%;
}
.about .about4 {
  border-left: 1px solid #000;
  border-right: 1px solid #000;
}
/*fabric*/
main.fabric {
  border-left: 1px solid #000;
  border-right: 1px solid #000;
}
.fabric .fabric1, .fabric .fabric2 {
  border-bottom: 1px solid #000;
}
.fabric .fabric1, .fabric .fabric2, .fabric .fabric3 {
  padding-top: 20px;
}
.fabric h2 {
  margin-bottom: 10px;
}
.fabric .fabric-box {
  padding: 4% 0;
}
.fabric .fabric2-box1 {
  border-top: 1px solid #000;
}
.fabric .fabric2-box2 {
  border-left: 1px solid #000;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
}
.fabric .fabric2-box3 {
  border-top: 1px solid #000;
}
.fabric .fabric2-box4 {
  border-top: 1px solid #000;
}
.fabric .fabric2-box5 {
  border-left: 1px solid #000;
  border-top: 1px solid #000;
}
.fabric .fabric3-box1 {
  border-top: 1px solid #000;
}
.fabric .fabric3-box1 {
  border-top: 1px solid #000;
}
.fabric .fabric3-box2 {
  border-left: 1px solid #000;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
}
.fabric .fabric3-box3 {
  border-top: 1px solid #000;
}
.fabric .fabric3-box4 {
  border-top: 1px solid #000;
}
.fabric .fabric3-box5 {
  border-left: 1px solid #000;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
}
.fabric .fabric3-box6 {
  border-top: 1px solid #000
}
.fabric .fabric3-box6 figure img{
  object-fit: cover;
  height: 100%;
}
/*--style--*/
main.style {
  border-left: 1px solid #000;
  border-right: 1px solid #000;
}
.style .style1 {
  padding-top: 20px;
}
.style .style1 h2{
  line-height: 4em;
}
.style .style1 .style1-text {
 padding: 0 20px 20px 20px;
}
.style .style2 h2 {
  padding: 30px 0;
  font-size: 20px;
  font-weight: normal;
}
.style .fig {
  border-bottom: 1px solid #000;
  border-left: 1px solid #000;
  border-right: 1px solid #000;
}
.style .fig0 {
  border-bottom: 1px solid #000;
}
.style .fig1 {
  border-top: 1px solid #000;
}
.style .fig2 {
  border-top: 1px solid #000;
  border-left: 1px solid #000;
  border-right: 1px solid #000;
}
.style .fig3 {
  border-top: 1px solid #000;
  border-right: 1px solid #000;
}
.style .fig4 {
  border-top: 1px solid #000;
  border-left: 1px solid #000;
}
.style .style2 {
  border-top: 1px solid #000;
} 
.style figure img{
  object-fit: cover;
  height: 100%;
}
.img_center {
    display: block;
    margin: 0 auto;
}
/*///////////////////////oter pages=END=/////////////////////*/

/*///////////////////////////footer/////////////////////*/
footer {
  border: 1px solid #000;
  padding: 10px 0;
}
footer.top {
  border: none;
}
footer.top figure {
   width: 200px;
   margin: 30px auto;
}
/*///////////////////////footer=END=/////////////////////*/
.sp-only {
  display: none;
}
/*////////////////////////PC&common=END=////////////////////////*/
/*y2020は1024タブレット縦, 896スマホ横, 480スマホ縦か？*/

@media only screen and (max-width: 960px) and (min-width: 668px){  /*667からihone6,7,8横*/
body        {
    -webkit-text-size-adjust: 100%;/*スマホ横で勝手に文字が拡大されるのを禁止*/
}

}

@media only screen and (max-width: 667px){ /*667からihone6,7,8横*/

.pc-only {
  display: none;
}
.sp-only {
  display: block;
}
h1.sp-only {
  border-bottom: 1px solid #000;
  padding-top: 30px;
}
.w50 {
  width: 100%;
}
.w60 {
  width: 100%;
}
.w40 {
  width: 100%;
}
.w60-1 {
  width: 100%;
}
.w40-1 {
  width: 100%;
}
.w33 {
  width: 100%;
}
.w30 {
  width: 100%;
}
.w36{
  width: 100%;
}
.w55 {
  width: 100%;
}
.w66 {
  width: 100%;
}
.w45 {
  width: 100%;
}
.upper {
  padding-top: 20px;
}
.about .about1 h2 img {
  margin-left: 5%;
}
.about .about2 .bd-1 {
  border-top: 1px solid #000;
  border-right: none;
}
.about .about2-right  {
  margin:0;
  padding:30px;
}
.about .about3-1 {
  padding: 0 30px;
}
.about .about3-box1 {
  border-top: 1px solid #000;
 border-bottom: none;
}
.about .about3-box2 {
  border-top: 1px solid #000;
 border-bottom: none;
 border-left: none;
 border-right: none;
}
.about .about3-box3 {
  border-top: 1px solid #000;
 border-bottom: none;
}
.about .about3-box4 {
  border-top: 1px solid #000;
 border-bottom: none;
}
.about .about3-box5 {
  border-top: 1px solid #000;
  border-bottom: none;
  border-left: none;
 border-right: none;
}
.about .about3-box6 {
  border-top: 1px solid #000;
 border-bottom: 1px solid #000;
}
.about .about3-box6 .spec{
  border-top: 1px solid #000;
}
.about .about3-box  .about3-wphoto{
  margin-left: 20%;
}
.about .about3-box  .min-w {
  min-width: 90px;
  max-width: 150px;
}
.about .about3-box .m27f {
  margin-left: 37%;
}
.about .about3-box .m30f {
  margin-left: 35%;
}
.about .about3-box .m42f {
  margin-left: 29%;
}
/*--fabric--*/
.fabric .fabric1 {
  padding: 20px;
}
.fabric .fabric2 h2, .fabric .fabric3 h2  {
  width: 90%;
}
.fabric .fabric-box {
  padding: 10% 0;
}
.fabric .fabric2-box1 {
  border-top: 1px solid #000;
}
.fabric .fabric2-box2 {
  border-left: none;
  border-top: 1px solid #000;
  border-right: none;
}
.fabric .fabric2-box3 {
  border-top: 1px solid #000;
}
.fabric .fabric2-box4 {
  border-top: 1px solid #000;
}
.fabric .fabric2-box5 {
  border-left: none;
  border-top: 1px solid #000;
}
.fabric .fabric3-box1 {
  border-top: 1px solid #000;
}
.fabric .fabric3-box1 {
  border-top: 1px solid #000;
}
.fabric .fabric3-box2 {
  border-left: none;
  border-top: 1px solid #000;
  border-right: none;
}
.fabric .fabric3-box3 {
  border-top: 1px solid #000;
}
.fabric .fabric3-box4 {
  border-top: 1px solid #000;
}
.fabric .fabric3-box5 {
  border-left: none;
  border-top: 1px solid #000;
  border-right: none;
}
.fabric .fabric3-box6{
  border-top: 1px solid #000
}
.fabric .fabric3-box6 figure img{
  object-fit: cover;
  height: 100%;
}
/*--style--*/
.style .fig {
  border-bottom: 1px solid #000;
  border-left: none;
  border-right: none;
}
.style .fig0 {
  border-bottom: 1px solid #000;
}
.style .fig1 {
  border-top: 1px solid #000;
}
.style .fig2 {
  border-top: 1px solid #000;
  border-left: none;
  border-right: none;
}
.style .fig3 {
  border-top: 1px solid #000;
  border-right: none;
}
.style .fig4 {
  border-top: 1px solid #000;
  border-left: none;
}
/*--ハンバーガー--*/
header nav.sp-only {
	position: fixed;
	top: 0;
	right:0;	
	height: 100%;
	z-index: 22;
	}	
.top-nav2 > ul li {
  padding-bottom:10px;
}
.top-nav2 > ul li a:hover {
  /*opacity: .7;*/
padding-bottom:16px;
}
.top-nav2 .act{
cursor: pointer;
}
.top-nav2 ul {
  position:relative;
}
.top-nav2 ul{
	position: absolute;
	top: 35px;
 	left:-35px;
  	width: 160px;
  	background: rgba(255,255,255,.9);
 	z-index: 10;
	padding:0;
}
.top-nav2  li {
 	padding: 10px 0;
	width: 100%;
}
.top-nav2  li a {
  text-decoration: none;
}
.top-nav2 ul {
  background: rgba(255,255,255,.9);
   margin-top: 0;
   padding: 0px;
   list-style: none;
   -webkit-transition: .35s ease-in-out;
   -moz-transition: .35s ease-in-out;
   transition: .35s ease-in-out;
   overflow-y: scroll;
   position: fixed;
   width: 90%;
   z-index: 100;
   top: 0px;
   height: 100%;
}
.top-nav2 ul li {
   padding: 10px 0;
   width: 100%;
  font-size: 16px;
}
.top-nav2 li a {
}
.top-nav2 ul {
   left : -100%;
}
.top-nav2 ul.active{
   left : 0px;
}
.move-2.on.btn{
  position: absolute;
  right: 10px;
  top: 10px;
 z-index: 101;
}
.sp-menu {
   width: 100%;
   margin-left: 65px;
}
.btn{
   width: 40px;
   height: 40px;
   position: absolute;
  right: 10px;
	top: 10px;
   color: #000;
	background: rgba(255,255,255, .9);
}
.btn:before,
.btn:after,
.btn span{
  display: block;
  width: 30px;
  position: absolute;
   -webkit-transition: .35s ease-in-out;
   -moz-transition: .35s ease-in-out;
   transition: .35s ease-in-out;
}
.btn span{
    height: 2px;
    background-color: #000;
    top: 48%;
	  right: 12%;
}
.btn:before{
    content: "";
    top: 28%;
	  right: 12%;
    border-top: 2px solid #000;
}
.btn:after{
    content: "";
     top: 68%;
	  right: 12%;
    border-bottom: 2px solid #000;
}
.btn.on span{
    display: none;
       width: 50px;
    height: 50px;
}
.btn.on:before{
    top: 45%;
    -webkit-transform: rotate(315deg);
    -moz-transform: rotate(315deg);
    transform: rotate(315deg);
}
.btn.on:after{
    top:45%;
   right: 5px;
    -webkit-transform: rotate(-315deg);
    -moz-transform: rotate(-315deg);
    transform: rotate(-315deg);
}
.btnlink{
    width: 90%;
    display: block;
    margin: auto;
    border: 1px solid #0060ff;
    border-radius: 5px;
    background: #4285F4;
    height: 35px;
    line-height: 35px;
    text-align: center;
    margin-bottom: 35px;
    color: #fff;
}
header nav li:first-child:hover {
  background: rgba(255,255,255,rgba(255,255,255,.9));
}
header nav li.advance-notice:hover:after {
  content: "2023年1月中旬スタート";
  display: block;
  position: absolute;
  top: 10px;
  color: #000;
  left:calc(50% - 80px);
}
header nav li.advance-notice2:hover:after {
  top: 10px;
}
}  

@media only screen and (max-width: 414px) {/*iphone6+*/

}

@media only screen and (max-width: 375px) {/*iphone6*/



}

@media only screen and (max-width: 320px) {/*iphone5*/


}

}

/* PCで電話番号リンクを無効に */
@media (min-width: 699px) {
    a[href*="tel:"] {
        pointer-events: none;
        cursor: default;
        text-decoration: none;
    }
 a:hover[href*="tel:"] {
        opacity: 1;
    }
}
@media print{
html, body{
	height:100%;
	max-width:640px !important;
}

}