#header-type4{position: fixed; left: 0; top: 0; width: 100%; height: auto;  z-index: 7;}
#header-type4 .logo{position: absolute; left: 20px; top: 20px;}
#header-type4 .logo img{width: 170px; height: auto;}

@media screen and (max-width: 840px) {
  #header-type4 .logo{position: absolute;left: 50%;top: 0; margin-left: -12.5vw;}
  #header-type4 .logo img{width: 25vw;height: auto;}
}

.btn_gnb_close,
.btn_gnb_open{text-align: right;position: absolute;left: 62px;top: 125px;width: 40px;height: 40px;font-size: 0; z-index: 5;}
.btn_gnb_open .line{display: inline-block; width: 100%; height: 8px; border-radius: 8px; background-color: #fff; opacity: 0.5; margin-bottom: 7px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}
.btn_gnb_open .line.n1{width: 100%;  }
.btn_gnb_open .line.n2{width: 70%; }
.btn_gnb_open .line.n3{width: 85%; }
.btn_gnb_open:hover .line{width: 100%; opacity: 1;}
.btn_gnb_close{z-index: 7; display: none;}
.btn_gnb_close img{height: 46px; width: auto; max-width: none;}

.sub.btn_gnb_close,
.sub.btn_gnb_open{position: fixed;left: 40px;top: 15px;width: 40px;height: 40px;font-size: 0;z-index: 8;}
.sub.btn_gnb_open .line{background-color: #000; height: 4px;}
@media screen and (max-width: 840px) {
  .btn_gnb_close img{height: 8vw;}
  .btn_gnb_close, .btn_gnb_open{left: 4vw; top: 4vw; width: 6vw;}
  .sub.btn_gnb_open{position: fixed;left: 3.6vw;top: 3.6vw;width: 7vw;height: 5vw;font-size: 0;z-index: 8;}
  .sub.btn_gnb_open .line{height: 0.8vw;}
  .btn_gnb_open .line{height: 0.8vw; margin-bottom: 1.1vw;}
}



.wrap_movie_main2{margin-bottom: 40px;}
@media screen and (max-width: 840px) {
  .wrap_movie_main2{margin-bottom: 4.7619vw;}
}
#gnb{position: fixed; left: 0; top: 0; width: 0%; height: 100%; background-color: #873a9d; z-index: 6; text-align: left; text-align: left; overflow: hidden;}
#gnb a{color: #fff;}
#gnb a:hover{color: #f3caff;}
#gnb .menulist{display: none; height: 100%; color: #fff; border-top: 1px solid #873a9d; vertical-align: top; text-align: left; overflow: hidden;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
 }
 #gnb .menulist{display: inline-block;}
 #gnb .menulist.n1{padding-left: 310px;}
 #gnb .menulist:nth-child(even){background-color: #612a71;}
/*#gnb .menulist:hover{background-color: #612a71;}*/
#gnb .menulist .inner{padding: 180px 70px;}
#gnb .h1{font-size: 30px; font-weight: 500; margin-bottom: 60px;}
#gnb .menu{text-align: left; color: #fff;}
#gnb .menu{overflow: hidden; width: 100%;}
#gnb .menu li{margin-bottom: 15px; font-size: 0.92em;}


@media screen and (max-width: 1360px) {
  #gnb .menulist.n1{padding-left: 120px;}
}

@media screen and (max-width: 930px) {
  #gnb .menulist.n1{padding-left: 60px;}
}

@media screen and (max-width: 840px) {
  #header-type4 .logo img{width: 24vw;}
  #gnb .menulist.n1{padding-left: 0;} 
  #gnb .menulist .inner{padding: 18vw 3vw; }
  #gnb .menulist{width: 33.3332%;}
  #gnb .h1{font-size: 5vw;font-weight: 500;margin-bottom: 3vw;}
  #gnb .menu li{margin-bottom: 3vw;}
}

.ist_sns_set1{display: none;}

#container.main{padding-top: 60px;}
@media screen and (max-width: 840px) {
  #container.main{padding-top: 7.1429vw;}
}

.head-type-mf p{font-size: 33px; color: #853b9c; font-weight: 600; letter-spacing: -1px;}
.wrap_designtype_v2 .inr-c{box-sizing: border-box;}
/*#area_allmenu{display: none;}*/
.allmenu_fot .btn_all, .allmenu_fot .btn_open,
.allmenu_fot{background-color: #7b3e8c !important; color: #fff;}
.allmenu_fot .btn_all span,
.allmenu_fot .btn_all:hover span{color: #fff  !important;}

#footer_type2.type2{background-color: #7b3e8c;}
#footer_type2.type2 .infomation{color: #fff;}
#footer_type2.type2 .area_lft:after{display: block; display: block; clear: both; height: 0; visibility: hidden;}
#footer_type2.type2 .logo{float: left;}
#footer_type2.type2 .infomation{margin-left: 205px;}
#footer_type2.type2 > .inr-c{padding: 80px 0 70px;}

.main-page > .header .h1{font-size: 36px;}
.main-page > .header.ty2 .h1{padding-bottom: 10px;}
.box-thumb1 .cont .h1{padding-left: 10px; font-size: 16px; position: relative; color: #101010; line-height: 1; }
.box-thumb1 .cont .h1:after{position: absolute;left: 0;top: 1px;width: 2px;height: 15px;background-color: #313131;content:"";}
.box-thumb1 .cont .t1{margin-top: 0; color: #000; line-height: 25px; height: 75px; font-weight: 500;}
.swiper-pagination-bullet{width: 16px; height: 16px; background-color: #fff; opacity: 0.4;}
.swiper-pagination-bullet-active{opacity: 1;}
@media screen and (max-width: 840px) {
  .swiper-pagination-bullet{width: 2vw; height: 2vw; margin: 0 1vw;}
}

.box-thumb1 .cont .t1 span{}
.wrap_designtype_v2 .inr-c{background-color: #e4e4e4;}
.wrap_designtype_v2 .col{border-color: #e4e4e4;}
@media screen and (max-width: 1440px) {
	#footer_type2.type2 > .inr-c{margin-left: 30px; margin-right: 30px;}
}

@media screen and (max-width: 840px) {
	#footer_type2.type2 > .inr-c{margin-left: 3.5714vw; margin-right: 3.5714vw; padding: 14.5238vw 0 10.5238vw;}
	#footer_type2.type2 .logo{float: none; text-align: center;}
	#footer_type2.type2 .infomation{margin-left: 0; margin-top: 3.5714vw;}
	#footer_type2.type2 .area_rgh{margin-top: 4.7619vw;}
}

.wrap_designtype_v2 .col.n4,
.wrap_designtype_v2 .col.n5,
.wrap_designtype_v2 .col.n6,
.wrap_designtype_v2 .col.n7,
.wrap_designtype_v2 .col.n8{display: none;}


.wrap_designtype_v3 .item:before {

  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#2a659d+0,2a659d+53&1+0,0+54,0+54 */
  background: -moz-linear-gradient(top, #662a79 0%, rgba(42, 101, 157, 0.02) 65%, rgba(42, 101, 157, 0) 66%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #662a79 0%, rgba(42, 101, 157, 0.02) 65%, rgba(42, 101, 157, 0) 66%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #662a79 0%, rgba(42, 101, 157, 0.02) 65%, rgba(42, 101, 157, 0) 66%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#662a79', endColorstr='#002a659d', GradientType=0);
  /* IE6-9 */
}

.wrap_designtype_v3 .item.item--width2:before {
 
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#2a659d+0,2a659d+53&1+0,0+54,0+54 */
  background: -moz-linear-gradient(top, #662a79 0%, rgba(42, 101, 157, 0.02) 35%, rgba(42, 101, 157, 0) 36%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #662a79 0%, rgba(42, 101, 157, 0.02) 35%, rgba(42, 101, 157, 0) 36%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #662a79 0%, rgba(42, 101, 157, 0.02) 35%, rgba(42, 101, 157, 0) 36%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#662a79', endColorstr='#002a659d', GradientType=0);
 
}

@media screen and (max-width: 840px) {
  .head-type-mf p{font-size: 7vw;color: #853b9c;font-weight: 600;letter-spacing: -1px;}
  .wrap_designtype_v3 .item--width2 .head .h1,
  .wrap_designtype_v3 .item--width2 .head .t1{color: #fff;}
}


#header-type-mf .logo img{width: 155px;}
@media screen and (max-width: 840px) {
  #header-type-mf .logo{margin-top: 0;}
  #header-type-mf .logo img{width: 22.9vw;}
  #header-type-mf .area_rgh .search{font-size: 4.481vw;}
  #header-type-mf .area_rgh a{margin-top: 3.4462vw;}
}