@charset "utf-8";
body{background:#222222;
font-family: 'Noto Sans JP', sans-serif;
color: #eeeeee;
font-size:1rem;
line-height:1.85;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-text-size-adjust: 100%; 
word-wrap: break-word;
}
/* area */
#container{overflow-x: hidden;/*以下、IE11用*/ z-index: 1; position: relative;}
/* font-family */
h1,
h2,
#footer-link,
#vidual-area dt
{font-family: 'Oswald', sans-serif; letter-spacing: 0.01em;}

#g-nav{font-family: 'Oswald', sans-serif; letter-spacing: 0.1em;}
h3,h5,h6{font-family: 'Oswald', sans-serif; margin: 0; padding:0; letter-spacing: 0.1em;}
.scrolldown1 span{font-family: 'Oswald', sans-serif; letter-spacing: 0.2em;}

/* heading */
h2{font-size: 5rem; margin: 0; text-transform: uppercase;}

/* header 5-1-6 **********************************************/
#header{position: fixed;/*fixedを設定して固定*/
/*height: 70px;*//*高さ指定*/
width:100%;/*横幅指定*/
z-index: 9999;/*最前面へ*/
/*以下はレイアウトのためのCSS*/
display: flex;
justify-content: space-between;
align-items: center;
text-align: center;
padding: 0px 20px 0;
background:#ededec; border-bottom:1px solid #cccccc;
}

#header.noneMove{display: none;}
#header.UpMove{position: fixed; width:100%; animation: UpAnime 0.5s forwards;}
@keyframes UpAnime{
  from {opacity: 1; transform: translateY(0);}
  to {opacity: 0; transform: translateY(-100px);}
}
#header.DownMove{position: fixed; width:100%; animation: DownAnime 0.5s forwards;}
@keyframes DownAnime{
  from {opacity: 0; transform: translateY(-100px);}
  to {opacity: 1; transform: translateY(0);}
}
#header .float-header_r{border-radius: 30px; color: #ffffff;}
#header .float-header_l{border-radius: 30px; color: #ffffff;}
#header .float-header_r span{font-size:0.88em;}
#header .float-header_l span{font-size:0.88em;}
#header h1 a{color: #ddd;}

/* vidualarea **************************************************/
#vidual-area{position: relative; height: 100vh;}
body.appear #vidual-area::after{
content:'';
background:#960021;
width:0;
height: 12%;
position: absolute;
bottom:0;
right:0;
z-index: -1;
animation-name:vidualbgRLextendAnime;
animation-duration:.2s;
animation-fill-mode:forwards;
animation-timing-function: ease-in-out;
animation-delay: 1s;
}

@keyframes vidualbgRLextendAnime{
    0% {width:0;}
    100% {width:40%;}
}

#vidual-area #slider-area{position: absolute; top:0; right: 0; width:80%; z-index: -1;/*最背面へ*/ }
#vidual-area h1{position: absolute; top:30%; left:5%; color: #ffffff;}
#vidual-area h2{position: absolute; top:50%; left:5%; color: #ffffff; line-height: 1.5; font-size: 1.3rem; letter-spacing: 0.5em;}
#vidual-area dl{position: absolute; left:2%; bottom:2%;}
#vidual-area dl{color:#dddddd;}
#vidual-area dt,
#vidual-area dd,
#vidual-area ul,
#vidual-area ul li{display: inline-block;}
#vidual-area dt{text-transform: uppercase;}
#vidual-area ul li{margin:0 8px;}
#vidual-area ul img{width:20px;}
#vidual-area ul li i{font-size:1.5em; color:#dddddd;}
.scrolldown1 span {transform: rotate(-90deg); text-transform:uppercase; left: -23px; top: -31px;}

/* concept **************************************************/
#concept{margin: 0 auto; padding: 0; text-align: center;}
#concept .concept-area{margin: 0 auto; padding: 4% 10%; /* padding: 8% 10%; */text-align: center;}
#concept h3{font-size:1.1rem; line-height: 1.8; margin: 8px auto 28px; color: #ffffff;}
#concept h3 br{/*display: none;*/}
#concept p{font-size:0.8em; color: #dddddd;}

/* news **************************************************/
#news{margin: 0 auto; padding:33px 8px; background:#ffffff; color: #222222;}
#news p{margin: 0 auto 8px;}
#news .eria-left {float: left; width: 48%; margin:0 auto; padding:0 1%;}
#news .eria-right {float: right; width: 48%; margin:0 auto; padding:0 1%;}

/* service **************************************************/
/* #service{margin: 0 auto; padding: 8% 0 8% 15%; background:#ffffff;} 通常余白*/
#service{margin: 0 auto; padding: 0 0 8% 15%; background:#ffffff;}

#service .service-area{color: #222222; display: flex; justify-content: space-between; flex-wrap: wrap; padding:10% 0 0 10%; position: relative; z-index: 1;}
#service .service-area::after{opacity: 0;}
#service .service-area.startwd::after{
content:'';
position: absolute;
top:10%;
right:0;
width:80%;
height: 60vh;
background:#ededec;
z-index: -1;
animation-name:sevicebgRLextendAnime;
animation-duration:.9s;
animation-fill-mode:forwards;
animation-timing-function: ease-in-out;
}

@keyframes sevicebgRLextendAnime{
    0% {opacity: 0; width:0;}
    100% {opacity: 1; width:80%;}
}

#service .service-area section{width:30%;}
#service .service-area section h3{font-size:2rem; margin: 0 0 30px 0;}
#service .service-area section p{margin: 0 0 30px 0;}
#service .service-img-wrapper{position:relative; overflow: hidden; width:30%; height: 60vh; }
#service .service-img{height: 60vh; background:url("../img/01.jpg") no-repeat center; background-size: cover;}

/* servicemenu ******************************************/
#servicemenu{margin: 0 auto; padding: 4% 10%;}
#servicemenu h2 span{font-size: 2rem;}

/* pricemenu ******************************************/
#pricemenu{margin: 0 auto; padding: 4% 10%; background:#ffffff; color: #222222;}
#pricemenu h2 span{font-size: 2rem;}
#pricemenu h3.ladys{font-size:1.3em; margin: 0 auto; padding: 0; color: #4a546b; border-bottom: 1px solid #f7c4ed; line-height:1.5;}
#pricemenu h3.ladys:first-letter {margin-right: .1em; font-size: 1.5em;/* color: #f7c4ed;*/}
#pricemenu h3.mens{font-size:1.3em; margin: 0 auto; padding: 0; color: #4a546b; border-bottom: 1px solid #b0d4ea; line-height:1.5;}
#pricemenu h3.mens:first-letter {margin-right: .1em; font-size: 1.5em;/* color: #b0d4ea;*/}

.pricemenu-area{display: flex; justify-content: space-between;/*justify-content: space-between;*/ flex-wrap: wrap; margin: 0 auto; padding: 0;}
.pricemenu-wrapper{position:relative; overflow: hidden; height: 50vh; width:50%;}
.pricemenu-content{width:50%; padding: 0 1%; animation-delay: 0.3s;}

/* reservation ******************************************/
#reservation{margin: 0 auto; padding: 4% 10%; background:#ededec; color: #222222;}
#reservation h2 span{font-size: 2rem;}
#reservation h3{font-size:2rem; margin: 0 auto; padding: 0; border-bottom: 1px dashed #cccccc;}
.reservation-area{display: flex; justify-content: space-between;/*justify-content: space-between;*/ flex-wrap: wrap; margin: 0 auto; padding: 0;}
.reservation-wrapper{position:relative; overflow: hidden; height: 50vh; width:50%;}
.reservation-img{background:url("../img/reservation-img_01.jpg") no-repeat center; background-size: cover; height: 50vh;}
.reservation-content{width:50%; padding: 0 1%; animation-delay: 0.3s;}
#reservation a:link {color:#960021;}
#reservation a:hover {color:#ffffff;}


/* information ******************************************/
#information{margin: 0 auto; padding: 4% 10%; background:#ffffff; color: #222222;}
#information h2 span{font-size: 2rem;}
#information h3{font-size:2rem; margin: 0 auto; padding: 0;}
.information-area{display: flex; justify-content: space-between;/*justify-content: space-between;*/ flex-wrap: wrap; margin: 0 auto; padding: 0;}
.information-wrapper{position:relative; overflow: hidden; height: 50vh; width:50%;}
.information-img{background:url("../img/information-img_01.jpg") no-repeat center; background-size: cover; height: 50vh;}
.information-img p{margin: 0 auto; padding: 0; }
.information-content{width:50%; padding: 0 1%; animation-delay: 0.3s;}
.information-content p{margin: 0 auto 48px; padding: 0; }


/* staff ******************************************/
#staff{margin: 0 auto; padding: 4% 10% 0; background:#ffffff; color: #222222;}
#staff h2 span{font-size: 2rem;}
/* staff-area ******************************************/
#staff-area{width:100%; padding: 0% 5% 8%; background:#ffffff;}
#staff-area ul{margin:0; padding: 0; list-style: none;}
#staff-area ul li img{margin:0 0 20px 0; padding: 0; border-radius: 3px; box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.5);}

/* groupsalon ******************************************/
#groupsalon{margin: 0 auto; padding: 4% 10%; background:#ededec; color: #222222; border-top:solid 1px #cccccc; border-bottom:solid 1px #cccccc;}
#groupsalon h2 span{font-size: 2rem;}
#groupsalon h3{font-size:2rem; margin: 0 auto; padding: 0;}
.groupsalon-area{width:100%;}
.groupsalon-area ul{display: flex; flex-wrap: wrap; justify-content:space-around;}
.groupsalon-area ul li{width:32%; margin: 0.5%; padding: 10px; text-align: center;}
.groupsalon-area ul li span{display: block; padding: 0;}
.groupsalon-area ul li a{display: block;}
.groupsalon-area ul li:nth-of-type(1){/*animation-delay: 0.5s;*/}
.groupsalon-area ul li:nth-of-type(2){animation-delay: 0.2s;}
.groupsalon-area ul li:nth-of-type(3){animation-delay: 0.4s;}

/* footer ***************************************/
#footer{display: flex; justify-content: space-between; flex-wrap: wrap; /*align-items: center;*/ margin: 0 auto; padding: 5% 5% 0;}
#footer .footer-info{width:30%; margin: 0 auto; padding: 0;}
#footer .footer-info .footer-logo{margin: 0 auto; padding: 0;}
#footer .footer-link{width:65%; text-align: right; font-size:0.88em;}
#footer .footer-link ul {display: flex; flex-wrap: wrap; /*line-height: 2.5;*/ justify-content: flex-end; align-items: center; list-style: none;}
#footer .footer-link ul li{margin: 0 18px; font-size: 1em;}
#footer .footer-link ul li a,
#footer .footer-link ul li a:link, 
#footer .footer-link ul li a:visited {color: #ffffff; text-decoration: none;}
#footer .footer-link ul li a:hover {color: #ff0000; text-decoration: none;}
#footer .footer-link ul ul li{margin:0 10px 0 0;}
#footer .footer-link ul ul{display: block;}
#footer .company_nav {margin: 0 auto; font-size:0.7em;}
#footer .company_nav li a:before {color:#cccccc; margin:0 4px; font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f105";}
#footer hr {margin: 8px auto; border-top: 1px dashed #aaaaaa;}
#footer small{padding: 80px 0 20px 0; display: block; text-align: right; color: #aaaaaa;}

#footer dl{margin: 48px auto 0; padding: 0;}
#footer dl{color:#dddddd;}
#footer dt,
#footer dd,
#footer ul,
#footer ul li{display: inline-block;}
#footer dt{text-transform: uppercase;}
#footer ul li{margin:0 8px;}
#footer ul img{width:20px;}
#footer ul li i{font-size:1.5em; color:#dddddd;}

/*= footer_fixedarea PC Tbios off =========================*/
#footer_fixedarea {position: fixed; /* 固定 */
bottom: 0; /* 一番下に表示 */
display: flex; flex-wrap: wrap; justify-content:space-around;
width: 100vw;
z-index: 1000;
margin:0 auto; padding:0;
text-align: center;
background-color: #960021;
color: #ffffff;
border-top:1px solid #ffffff;
vertical-align:baseline;
letter-spacing: 0.01em;}
/* column3-ovlight 3カラム shadow none------------------------------------------------------------*/
#footer_fixedarea .eria {float: left; margin:0 auto 0; padding:8px;}
#footer_fixedarea .eria:nth-of-type(1){width:15%;
background: rgb(255,221,131);
background: -moz-linear-gradient(45deg, rgba(255,221,131,1) 0%, rgba(242,105,57,1) 25%, rgba(207,46,146,1) 50%, rgba(76,100,211,1) 75%);
background: -webkit-linear-gradient(45deg, rgba(255,221,131,1) 0%, rgba(242,105,57,1) 25%, rgba(207,46,146,1) 50%, rgba(76,100,211,1) 75%);
background: linear-gradient(45deg, rgba(255,221,131,1) 0%, rgba(242,105,57,1) 25%, rgba(207,46,146,1) 50%, rgba(76,100,211,1) 75%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffdd83",endColorstr="#4c64d3",GradientType=1);
border-right:1px solid #ffffff;}
#footer_fixedarea .eria:nth-of-type(2){width:15%; background:#ff0000; border-right:1px solid #ffffff;}
#footer_fixedarea .eria:nth-of-type(3){width:70%;}

#footer_fixedarea .eria-recruit {float: left; margin:0 auto 0; padding:5px 0; font-size:1em; line-height:1.4;}
#footer_fixedarea .eria-recruit:nth-of-type(1){width:50%; background:#06c755; border-right:1px solid #ffffff;}
#footer_fixedarea .eria-recruit:nth-of-type(2){width:50%; background:#3c72b9;}
#footer_fixedarea .eria-recruit i{color:#ffffff; font-size:1em; padding-right:2px;}
#footer_fixedarea .eria-recruit span{display: block; font-size: 0.8em; font-weight: normal;}

#footer_fixedarea p{color:#ffffff; margin:0 auto 0; text-align:center; font-size:1.1em; line-height:1.2;}
#footer_fixedarea i{color:#ffffff; font-size:1.8em;}
#footer_fixedarea img{height: 2em; width:auto;}
#footer_fixedarea span{display: block; font-size: 0.7em; font-weight: normal;}
#footer_fixedarea a:link,
#footer_fixedarea a:visited {color: #ffffff; text-decoration: none;}
#footer_fixedarea a:hover,
#footer_fixedarea a:active {color: #ffffff; text-decoration: none;}

/* iframe-open------------------------------------------------------------*/
#footer-iframe-open{margin: 0 auto 22px; padding: 0 2% 8%; color: #333333;}

/*==========================================
 contentCSS
===========================================*/
/* related-header ---------------------------------------*/
#related-header {margin: 0 auto; padding: 18px 10%; /*height: 410px;*/ background:#13090b;
background-image: url("../img/related-header_img.jpg");
background-size: contain;
background-repeat: no-repeat;
background-position: top;
background-attachment:fixed;
}
#related-header p{font-size: 1em; font-weight: normal; margin:8px; color:#ffffff; letter-spacing: 0.1em;}
.header-area{color: #ffffff; text-align: center; margin: 0 auto 0; padding: 8px 0;}
.header-area h2{display: block; font-size: 1.8em; font-weight: 500; line-height: 1; letter-spacing: 0.1em; padding: 0; align-items: center; justify-content: center;}
.header-area h2 span{display: block; font-size: 0.8em; font-weight: normal; margin:8px auto; color:#ffffff;}

/* related-title    ceremonyheder---------------------------------*/
.related-title {text-align:center; margin:22px auto 18px; padding:0;}
.related-title h4 {font-size: 1.5em; font-weight: normal; margin:0 auto; color: #000000; letter-spacing:1px; line-height: 1.2em; position: relative;text-align: center;}
.related-title h4 span {position: relative; z-index: 2; display: inline-block; background-color: #ffffff; margin:0 auto; padding:0 8px; text-align: center;}
.related-title h4::before {position: absolute; top: 50%; z-index: 1; content: ''; display: block; width: 100%; height: 1px; background: #bbbbbb;
background: -webkit-linear-gradient(-45deg, transparent, #bbb 10%, #bbb 90%, transparent);
background: linear-gradient(-45deg, transparent, #bbb 10%, #bbb 90%, transparent);}

/* related_stage-contents ---------------------------------------*/
.related_stage-contents {text-align:left; margin: 0 auto; padding: 3% 10%; background:#ffffff; color: #333333; }
.related_stage-contents:after{content: ""; display: block; clear: both}
.related_stage-contents p{margin:0 auto; padding: 0 0 18px;}
.related_stage-contents p.eria-0_sp{margin:0 auto; padding: 0 0 30px;}
.related_stage-contents section {width: 100%;}
.related_stage-contents article {width: 100%; margin:22px auto; padding:0;}
.related_stage-contents aside {width: 100%; margin:22px auto; padding:22px 0;}
.related_stage-contents h2 span{font-size: 2rem;}
.related_stage-contents h3 {font-size: 1.3em; margin:30px auto 0; padding: 0;}
.related_stage-contents h3:first-letter {margin-right: .1em; font-size: 1.5em; color:#d90000;}
.related_stage-contents h3 span {font-size: 0.7em; font-weight:normal; color: #333333; margin:auto 8px; padding: 0;}
.related_stage-contents h4 {margin:30px auto 10px; padding: 0;}
/*.related_stage-contents h4 span {margin:0 auto; padding: 0;}*/

.related_stage-contents .course-list{display: flex; justify-content: space-around; flex-wrap: wrap; align-items: stretch; margin:0 auto;}
.related_stage-contents .course-list-inner:nth-child(1) {width:50%; position: relative; margin:0; padding:0 2px 0 0;}
.related_stage-contents .course-list-inner:nth-child(2) {width:50%; position: relative; margin:0; padding:0 0 0 2px;}
.related_stage-contents .course-list aside{width:48%; position: relative; margin:1%; padding:18px 18px; border:solid 1px #cccccc;}

/* related_stage-contents_mp0px ---------------------------------------*/
.related_stage-contents_mp0px {text-align:center; margin: 0 auto; padding: 0 10%; background:#ffffff; color: #333333; }
.related_stage-contents_mp0px:after{content: ""; display: block; clear: both}
.related_stage-contents_mp0px p{margin:0 auto; padding: 0; background:#ffffff;}
.related_stage-contents_mp0px section {width: 100%;}
.related_stage-contents_mp0px h2 span{font-size: 2rem;}

/* related_stage-contents_mp0pxleft ---------------------------------------*/
.related_stage-contents_mp0pxleft {margin: 0 auto; padding: 0 10%; background:#ffffff; color: #333333; }
.related_stage-contents_mp0pxleft:after{content: ""; display: block; clear: both}
.related_stage-contents_mp0pxleft p{margin:0 auto; padding: 0;/* background:#ffffff;*/}
.related_stage-contents_mp0pxleft section {width: 100%;}
.related_stage-contents_mp0pxleft h2 span{font-size: 2rem;}

/* related_stage-contents_gallery ---------------------------------------*/
.related_stage-contents_gallery {text-align:center; margin: 0 auto; padding: 4% 0}
.related_stage-contents_gallery:after{content: ""; display: block; clear: both}
.related_stage-contents_gallery ul{margin:0; padding: 0; list-style: none;}
.related_stage-contents_gallery ul li img{margin:0 0 20px 0; padding: 0; border-radius: 3px; box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.5);}
.related_stage-contents_gallery section {width: 100%;}

/* related_stage-2contents ***************************************/
.related_stage-2contents{margin: 0 auto; padding: 3% 10%; background:#ffffff; color: #333333;}
.related_stage-2contents:after{content: ""; display: block; clear: both}
.related_stage-2contents p{margin:0 auto; padding: 0 0 18px;}
.related_stage-2contents p.eria-0_sp{margin:0 auto; padding: 0 0 30px;}
.related_stage-2contents section {width: 100%;}
.related_stage-2contents h2 span{font-size: 2rem;}
.related_stage-2contents h4 {margin:33px auto 0; padding: 0;}
.related_stage-2contents h4 span {margin:0 auto; padding: 0 8px;}
.related_stage-2contents-area{display: flex; /*justify-content: space-around;*/justify-content: space-between; flex-wrap: wrap; margin: 48px auto;}
.related_stage-2contents-inner{width:48%; margin: 0 1%; padding: 0.5%;}
.related_stage-2contents-area_mp0px{display: flex; /*justify-content: space-around;*/justify-content: space-between; flex-wrap: wrap; margin: 0 auto;}
.related_stage-2contents-innerbox{width:45%; margin: 0 2.5%; padding: 0.5%;}
.div_box005{width: 100%; margin:8px auto; padding:0; border:solid 1px #ffffff; background-color: #ffffff; text-align:center; line-height:1.5;}
.div_box005 p{margin: 8px auto; padding: 2px;}

/* related_stage-3contents ***************************************/
.related_stage-3contents{margin: 0 auto; padding: 0 10% 3%; background:#ffffff; color: #333333;}
.related_stage-3contents:after{content: ""; display: block; clear: both}
.related_stage-3contents p{margin:0 auto; padding: 0 0 18px;}
.related_stage-3contents p.eria-0_sp{margin:0 auto; padding: 0 0 30px;}
.related_stage-3contents section {width: 100%;}
.related_stage-3contents h2 span{font-size: 2rem;}
.related_stage-3contents-area{display: flex; /*justify-content: space-around;*/justify-content: space-between; flex-wrap: wrap; margin: 0 auto;}
.related_stage-3contents-inner{width:32.3%; padding: 0 0.5%;}

/* related_stage-contents ---------------------------------------*/
.related_stage-contents_bkc001 {background:#333132; color: #ffffff; }
.related_stage-contents_bkc002 {background:#758492; color: #ffffff; }
.related_stage-contents_bkc003 {background:#e5e5e5;}
.related_stage-contents_bkc004 {background:#67c3c7;}
.related_stage-contents_bkc005 {background:#fff2bd;}
.related_stage-contents_bkcimg001 {
background-repeat: no-repeat;
background-position: top;
background-size: cover; 
background-image: url("../img/bkcimg001.jpg");
}

.related_stage-contents_bkcimg002 {
background-repeat: no-repeat;
background-position: top;
background-size: cover; 
background-image: url("../img/bkcimg002.jpg");
}

.related_stage-contents_bkcimg003 {
background-repeat: no-repeat;
background-position: top;
background-size: cover; 
background-image: url("../img/bkcimg003.jpg");
}

/* bridal-service **************************************************/
#bridal-service{margin: 0 auto; padding: 0; background:#ffffff;}
#bridal-service:after{content: ""; display: block; clear: both}
#bridal-service .service-area{color: #222222; display: flex; justify-content: center; flex-wrap: wrap; margin: 0 auto; padding:8% 0 0 0%; position: relative; z-index: 1;}
#bridal-service .service-area::after{opacity: 0;}
#bridal-service .service-area.startwd::after{content:''; position: absolute;
top:0%; right:0; width:100%; height: 50vh; background:#e5e5e5; z-index: -1;
animation-name:sevicebgRLextendAnime;
animation-duration:.9s;
animation-fill-mode:forwards;
animation-timing-function: ease-in-out;
}

@keyframes sevicebgRLextendAnime{
    0% {opacity: 0; width:0;}
    100% {opacity: 1; width:100%;}
}
#bridal-service .service-area section{width:auto; padding: 0 0.5%;}


/* topics-description ***********************************************/
.topics-area-description{margin:0 auto 1%;/*display: flex; justify-content: space-around; flex-wrap: wrap;*/}
.topics-area-description article{background: linear-gradient(45deg,  rgba(70,158,148,1) 0%,rgba(118,194,142,1) 100%); border-radius: 5px;}
.topics-area-description article:nth-of-type(1){width:24%; float: left; margin:0.5%; box-shadow: 0 0 5px #469e94;}
.topics-area-description article:nth-of-type(2){width:24%; float: left; margin:0.5%; box-shadow: 0 0 5px #469e94;}
.topics-area-description article:nth-of-type(3){width:24%; float: left; margin:0.5%; box-shadow: 0 0 5px #469e94;}
.topics-area-description article:nth-of-type(4){width:24%; float: left; margin:0.5%; box-shadow: 0 0 5px #469e94;}
.topics-area-description .topics-block{padding:8px 10px;}
.topics-area-description .topics-block h4{font-size: 1.2em; margin:0 auto; color:#ffffff; line-height: 1.5;}
.topics-area-description .topics-block h4 span{display: block; font-size: 0.7em; color:#ffffff;}
.topics-area-description .topics-block p{font-size: 1em; margin:0 auto;}
.zoomOut .mask{border-radius: 5px 5px 0 0;}
/*=　7-2 ===========================================================*/
.zoomOut img{border-bottom: 1px solid #888888; transform: scale(1.1); transition: .3s ease-in-out;}
.zoomOut:hover img{transform: scale(1);}
.zoomOut .mask{display: block; height: 12vw; overflow: hidden;}