@charset "utf-8";

#page-business_arena{
	background: #fff;
}

/*navigation*/
#wrap-nav {
	width: 100%;
	height: 106px;
	background: rgba(34, 34, 34, 1.00)
}

@media screen and (max-width: 1024px) {
	#wrap-nav {
		height: 50px;
	}
}

/*Main Stage*/
#wrap-main-satge {
	width: 100%;
	height: 50vw;
	position: relative;
	display: inline-flex;
	align-items: center
}

.img-main-stage {
	width: 100%;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	z-index: -1;
	text-align: center;
	background: rgba(0, 0, 0, 1);
}

.img-main-stage video {
	width: 100%;
}

@media all and (max-width:1100px) {
	.img-main-stage video {
		width: 124%;
		margin: 0 0 0 -12%;
	}

}

@media screen and (max-width: 1024px) {
	#wrap-main-satge {
		height: 85vw
	}
}

@media all and (max-width:415px) {
	#wrap-main-satge {
		height: 140vw
	}
}

/*intro*/
.wrap-intro {
	width: 100%;
	position: relative;
	margin: 2em 0
}

.wrap-intro .txt-index {
	max-width: 800px
}
.wrap-intro .wrap-step{
	max-width: 1240px;
	margin: 0 auto;
}


@media all and (max-width:800px) {
	.wrap-intro {
		width: 80%;
		margin: 0 auto
	}
}

@media all and (max-width:415px) {
	.wrap-intro {
		width: 90%;
	}

	.wrap-intro .txt-index br {
		display: none;
	}
}
/*highlight*/
.wrap-highlight {
	width: 100%;
	position: relative;
	margin: 2em 0
}

.wrap-highlight .txt-index {
	max-width: 800px
}

.wrap-highlight .wrap-step {
	max-width: 800px;
	margin: 0 auto;
}

@media all and (max-width:800px) {
	.wrap-highlight {
		width: 80%;
		margin: 0 auto
	}
}

@media all and (max-width:415px) {
	.wrap-highlight {
		width: 90%;
	}

	.wrap-highlight .txt-index br {
		display: none;
	}
}
/*roadmap*/
.wrap-roadmap .demo-column{
    max-width: 1240px;
    margin: 2vw auto 0;
    
}
/*wrap-plan*/
.wrap-plan{
    background: #eff3f6;
    padding: 5rem 0;
}
.wrap-plan tr.head{
    background: linear-gradient(to right, #30b0bb 0%,#2373ca 100%);
    color: #fff;
    padding: 5px 0;
    display: flex;
    width: 100%;
}

.wrap-plan th:not(:last-child){
    border-right: solid 2px #fff;
}

.wrap-plan tr:not(.head){
    border-bottom: solid 2px #fff;
}

.wrap-plan th,.wrap-plan td{
        width: 25%;
    padding: 10px 5px;
    min-height: 55px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
        font-size: 1.5rem;
    }

.wrap-plan th{
    padding: 5px;
    min-height: 0;
}

/*instructor*/
.instructor{
    color: #fff;
}
.instructor .txt-headline{
    font-size: 4.0rem!important;
    margin-bottom: 0.5em;
}
/*demo*/
.wrap-demo {
	width: 100%;
	position: relative;
	margin: 2em 0;
}

.wrap-demo .wrap-txt-cent .txt-index {
	font-style: italic;
	margin: .5em auto 0;
	font-family: 'urw-din-condensed';
	font-size:2.0em;
	font-weight: 900;
}

.wrap-demo .wrap-txt-cent .txt-index.prd-content{
	font-size: 1.2em;
	font-weight: 400;
} 

.wrap-demo .wrap-step {
	max-width: 1240px;
	margin: 0.5em auto 0;
	display: flex;
	justify-content: space-between;
}

.wrap-demo .wrap-step .demo-column{
	width: calc(33% - 10px);
}

@media all and (max-width:800px) {
	.wrap-demo {
		width: 80%;
		margin: 0 auto
	}
}

@media all and (max-width:415px) {
	.wrap-demo {
		width: 90%;
	}

	.wrap-demo .txt-index br {
		display: none;
	}
}

/*invest*/
.wrap-invest {
	width: 100%;
	position: relative;
	margin: 2em 0;
}

.wrap-invest .wrap-step {
	max-width: 1240px;
	margin: 0.5em auto 0;
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}

.wrap-invest .wrap-step .demo-column{
	width: calc(45% - 20px);
	margin-top: 2.5em;
}

.wrap-invest .wrap-step .txt-index {
	font-family: 'urw-din-condensed';
    font-style: italic;
	margin: 0.3em auto 0;
	font-size:2.0em;
	font-weight: 900;
}

.wrap-invest .wrap-step .txt-index.prd-content{
	font-size: 1.4em;
	font-weight: 400;
} 

@media all and (max-width:800px) {
	.wrap-invest {
		width: 80%;
		margin: 0 auto
	}
}
@media all and (max-width:768px) {
	.wrap-invest .wrap-step .txt-index {
		font-size: 1em !important;
	}
	.wrap-invest .wrap-step .demo-column{
	width: calc(100% - 10px);
		margin: 0 auto 2.5em;
}
}

@media all and (max-width:415px) {
	.wrap-demo {
		width: 90%;
	}

	.wrap-invest .txt-index br {
		display: none;
	}
}

/*about*/
.qua-hor .wrap-bg {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1
}

.qua-hor .temp-01-bg {
	width: 100%;
	height: 66vw;
	background: center / cover no-repeat url("../../img/business_arena/desktop/rectangle5copy 3.jpg")
}

.wrap-about .wrap-rl {
	min-height: 57vw
}

.wrap-about .cta-white {
	margin: 0 0 0 1.5em
}

.wrap-about .txt-headline {
	font-size: 2.1em !important
}

.box-caption {
	position: absolute;
	bottom: 7vw;
	left: 2vw;
	font-family: "Noto Sans JP",sans-serif;
	font-weight: 600;
	font-size: .8em;
	color: rgba(255, 255, 255, 1.00)
}

.wrap-about .wrap-rl .wrap-copy .wrap-txt-left .txt-headline {
	max-width: 685px
}

@media all and (max-width:1024px) {
	.wrap-about.qua-hor .wrap-rl {
		flex-flow: row nowrap;
		justify-content: flex-start;
		align-items: center;
	}

	/*.wrap-about .wrap-rl{height:100vw}*/
	.qua-hor .wrap-rl .wrap-main-img {
		width: 85%
	}

	.wrap-about .wrap-rl {
		height: 65vw;
	}

	.wrap-about .txt-headline {
		font-size: 1.6em !important
	}

	.qua-hor .temp-01-bg {
		width: 100%;
		height: 65vw;
		background: center / cover no-repeat url("../../img/business_arena/tablet/rectangle5copy-3.jpg")
	}

	.wrap-about.qua-hor .wrap-rl .wrap-main-img {
		width: 70%
	}
}

@media all and (max-width:768px) {
	.wrap-about .wrap-rl {
		height: 120vw
	}

	.qua-hor .temp-01-bg {
		height: 120vw
	}

	.wrap-about.qua-hor .wrap-rl .wrap-main-img {
		width: 0%
	}

	.wrap-about .wrap-rl .wrap-copy .txt-headline {
		font-size: 1.35em !important
	}

	.wrap-about .wrap-rl .wrap-copy .txt-headline br {
		display: none
	}

	.wrap-about .wrap-rl .wrap-copy .wrap-txt-left .cta-white {
		margin: 1em 0 0 0
	}
}

@media all and (max-width:415px) {
	.wrap-about .wrap-rl .wrap-main-img {
		padding-bottom: 61vw
	}

	.wrap-about .wrap-rl {
		height: 146vw
	}

	.qua-hor .temp-01-bg {
		height: 162vw;
		background: top left / cover no-repeat url("../../img/business_arena/desktop/rectangle5copy 3.jpg")
	}

	.wrap-about .cta-white {
		margin: 1.5em 0 0
	}

	.box-caption {
		position: absolute;
		bottom: 3vw;
		left: 5vw
	}
    .table{
        width: 100%!important;
    }
}

@media all and (max-width:380px) {
	.wrap-about .wrap-rl {
		height: 150vw
	}

	.qua-hor .temp-01-bg {
		height: 168vw;
	}
}

/*@media all and (max-width:380px) {
.wrap-about .wrap-rl{height:268vw}
.qua-hor .temp-01-bg{height:286vw}
}
*/
/*Find out how HADO*/
.wrap-slider {
	width: 100%;
	position: relative;
	background: #1c1e20;
}

.wrap-slider.hadoarena{
	background: #fff;
}

.wrap-slider .wrap-txt-cent {
	width: 75%;
	max-width: none;
	margin: 0 auto;
}

/*slider*/
.wrap-slide-btn {
	text-align: right;
	margin: 0 2vw 0vw 0
}

.wrap-slide-btn .s-prev {
	width: 100px;
	height: 13px;
	background: center / cover no-repeat url("../../img/business_arena/icon/icon-prev.png");
	border: none;
	display: inline-block;
	cursor: pointer;
	margin: 0 1vw
}

.wrap-slide-btn .s-next {
	width: 100px;
	height: 13px;
	background: center / cover no-repeat url("../../img/business_arena/icon/icon-next.png");
	border: none;
	display: inline-block;
	cursor: pointer
}

.wrap-slider-container {
	width: 100%;
	position: relative
}

.wrap-slider-container .box-content {
	width: 30vw;
	height: 30vw;
	display: flex;
	align-items: center;
	margin: 0 1vw;
	outline: none;
	opacity: .5;
	-webkit-transition: all 200ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
	-moz-transition: all 200ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
	-o-transition: all 200ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
	transition: all 200ms cubic-bezier(0.420, 0.000, 0.580, 1.000)
}

.wrap-slider-container .box-content.item-01 {
	background: center / cover no-repeat url("../../img/business_arena/desktop/slide1.jpg")
}

.wrap-slider-container .box-content.item-02 {
	background: center / cover no-repeat url("../../img/business_arena/desktop/slide2.jpg")
}

.wrap-slider-container .box-content.item-03 {
	background: center / cover no-repeat url("../../img/business_arena/desktop/slide3.jpg")
}

.wrap-slider-container .box-content.item-04 {
	background: center / cover no-repeat url("../../img/business_arena/desktop/slide4.jpg")
}

.wrap-slider.hadoarena .wrap-slider-container .box-content{
	position: relative;
}

.wrap-slider.hadoarena .wrap-slider-container .box-content img{
	width: 30vw;
	height: 30vw;
	object-fit: cover;
}

.wrap-slider.hadoarena .wrap-slider-container .box-content .txt-category{
	position: absolute;
	display: block;
	width: 100%;
	background: rgba(0,0,0,0.7);
	bottom: 0;
	left: 0;
	padding: 10px 15px;
  box-sizing: border-box;
  line-height: 1.3;
	font-size: 1.0em;
}

.slick-track {
	padding: 3vw 0 8vw
}

.slick-current {
	opacity: 1 !important;
	-moz-box-shadow: 0 0 50px rgba(255, 255, 255, 1);
	-webkit-box-shadow: 0 0 50px rgba(255, 255, 255, 1);
	box-shadow: 0 0 50px rgba(255, 255, 255, 1)
}

.s-prev2 {
	cursor: pointer;
	position: absolute;
	top: 55%;
	left: 33%;
	z-index: 999
}

.hadoarena .s-prev2 {
	background: rgba(0,0,0,0.85);
	border-radius: 50%;
	width: 35px;
  height: 35px;
  padding: 5px 0 4px 8px;
  box-sizing: border-box;
	top: 43%;
}

.s-next2 {
	cursor: pointer;
	position: absolute;
	top: 55%;
	right: 33%;
	z-index: 998
}

.hadoarena .s-next2 {
	background: rgba(0,0,0,0.85);
	border-radius: 50%;
	width: 35px;
  height: 35px;
  padding: 5px 0 4px 13px;
  box-sizing: border-box;
	top: 43%;
}

@media screen and (max-width: 1680px) {
	.slick-current {
		opacity: 1 !important;
		-moz-box-shadow: 0 0 30px rgba(255, 255, 255, 1);
		-webkit-box-shadow: 0 0 30px rgba(255, 255, 255, 1);
		box-shadow: 0 0 30px rgba(255, 255, 255, 1)
	}
}

@media screen and (max-width: 1024px) {
	.wrap-slide-btn {
		display: none
	}

	.wrap-slider-container .box-content {
		width: 50vw;
		height: 50vw
	}
	.wrap-slider.hadoarena .wrap-slider-container .box-content img{
	width: 50vw;
	height: 50vw;
}

	.slick-track {
		padding: 3.5vw 0 8vw
	}

	.s-prev2 {
		left: 24%
	}

	.s-next2 {
		right: 24%
	}
}

@media screen and (max-width: 768px) {
	.slick-track {
		padding: 4.5vw 0 8vw
	}
}

@media screen and (max-width: 415px) {
	.wrap-slider-container .box-content {
		width: 80vw;
		height: 80vw
	}
.wrap-slider.hadoarena .wrap-slider-container .box-content img{
	width: 80vw;
	height: 80vw;
}
	.qua-hor .wrap-rl .wrap-main-img {
		height: 0;
		padding-bottom: 18vw
	}

	.slick-track {
		padding: 7.5vw 0 8vw
	}

	.s-prev2 {
		left: 3%
	}

	.s-next2 {
		right: 3%
	}
}

@media screen and (max-width: 380px) {
	.wrap-slider-container .box-content .wrap-txt-cent .hero-slogan-nomo {
		font-size: 1.6em
	}
}

/*Partners*/
.wrap-partners {
	width: 100%;
	position: relative;
	background: #1c1e20
}

.wrap-badges {
	width: 80%;
	margin: 0 auto;
	text-align: center
}

.wrap-badges .badge-raw {
	margin: 2% auto
}

.wrap-badges .box-badge {
	display: inline-block;
	vertical-align: middle;
	-moz-transform: scale(0.65);
	-webkit-transform: scale(0.65);
	-o-transform: scale(0.65);
	-ms-transform: scale(0.65);
	transform: scale(0.65);
}

.wrap-badges .box-badge img {
	width: 100%;
	height: auto
}

.wrap-partners .wrap-txt-cent .txt-headline {
	margin: 0 1em 1em
}

@media all and (max-width:1024px) {
	.wrap-badges .box-badge {
		width: 15%
	}
}

@media all and (max-width: 415px) {
	.wrap-badges .box-badge {
		width: 50%;
		margin: 0
	}

	.wrap-badges {
		width: 96%;
		margin: 5vh 0 0
	}

	.wrap-badges .badge-raw {
		margin: 0;
		display: flex;
		align-items: center;
	}

	.wrap-partners .wrap-txt-cent .txt-headline {
		margin: 0 auto
	}
    .wrap-plan th,.wrap-plan td{
        font-size: 1.0rem;
    }
}

@media all and (max-width: 380px) {
	.wrap-badges .box-badge {
		width: 50%;
		margin: 0vw
	}

	.wrap-badges .box-badge img {
		width: 100%
	}

}

/*ACCESSBILITY*/
.qua-hor.wrap-acce {
	width: 90% !important;
	margin: 0 auto
}

.qua-hor .temp-04-main {
	width: 100%;
	height: 33vw
}

.qua-hor .wrap-bg {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1
}

.qua-hor .temp-04-bg {
	width: 100%;
	height: 33.618vw;
	background: center / cover no-repeat url("../../img/business_arena/desktop/accessbillity-image.jpg")
}

@media screen and (max-width: 1920px) {
	.qua-hor.wrap-acce .wrap-lr .wrap-copy {
		padding: 3vw 0
	}

	.qua-hor .temp-04-bg {
		height: 38vw
	}
}

@media screen and (max-width: 1440px) {
	.qua-hor .temp-04-bg {
		height: 43vw
	}
}

@media all and (max-width:1024px) {

	.qua-hor .temp-04-bg {
		height: 36vw
	}

	.qua-hor .temp-04-bg {
		width: 100%;
		height: 33.618vw;
		background: center / cover no-repeat url("../../img/business_arena/tablet/accessbillity-image.jpg")
	}

	.wrap-acce .wrap-lr .wrap-copy {
		background-color: #f2f2f2
	}
}

/*PROFUNDITY*/
.qua-hor.wrap-profundity {
	width: 90% !important;
	margin: 0 auto;
	background-color: #285e84;
}

.qua-hor .temp-05-main {
	width: 100%;
	height: 33vw
}

.qua-hor .wrap-bg {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1
}

.qua-hor .temp-05-bg {
	width: 100%;
	height: 34.618vw;
	background: center / cover no-repeat url("../../img/business_arena/desktop/profundity-image.jpg")
}

@media screen and (max-width: 1920px) {
	.qua-hor .wrap-rl .wrap-copy {
		padding: 3vw 0
	}
}

@media screen and (max-width: 1440px) {
	.qua-hor .temp-05-bg {
		height: 42vw
	}
}

@media screen and (max-width: 1024px) {
	.qua-hor .temp-05-bg {
		height: 33vw
	}

	.qua-hor .temp-05-bg {
		width: 100%;
		height: 34.618vw;
		background: center / cover no-repeat url("../../img/business_arena/tablet/profundity-image.jpg")
	}

	.wrap-profundity .wrap-rl .wrap-copy {
		background-color: #285e84
	}
}

.qua-hor .temp-sp01-bg {
		width: 100%;
		height: 26.618vw;
		background: center / cover no-repeat url("../../img/business_arena/desktop/bg_support01.png");
	}
.qua-hor .temp-sp02-bg {
		width: 100%;
		height: 26.618vw;
		background: center / cover no-repeat url("../../img/business_arena/desktop/bg_support02.png");
	}
.qua-hor .temp-sp03-bg {
		width: 100%;
		height: 26.618vw;
		background: center / cover no-repeat url("../../img/business_arena/desktop/bg_support03.png");
	}
.qua-hor .temp-sp04-bg {
		width: 100%;
		height: 26.618vw;
		background: center / cover no-repeat url("../../img/business_arena/desktop/bg_support04.png");
	}
.qua-hor .temp-sp05-bg {
		width: 100%;
		height: 26.618vw;
		background: center / cover no-repeat url("../../img/business_arena/desktop/bg_support05.png");
	}
.qua-hor .temp-sp06-bg {
		width: 100%;
		height: 26.618vw;
		background: center / cover no-repeat url("../../img/business_arena/desktop/bg_support06.png");
	}
.qua-hor .temp-inst-bg {
		width: 100%;
		height: 27.618vw;
		background: center / cover no-repeat url("../../img/business_arena/desktop/bg_instructor.jpg");
	}

.qua-hor .temp-sp01-main{
	height: 27vw;
}
.support .txt-index{
	font-style: italic;
  font-family: 'urw-din-condensed';
}
/*PROFITABILITY*/
.qua-hor.wrap-prof {
	width: 90% !important;
	margin: 0 auto;
	background-color: #dde2e8
}

.qua-hor .temp-06-main {
	width: 100%;
	height: 33vw
}

.qua-hor .wrap-bg {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1
}

.qua-hor .temp-06-bg {
	width: 100%;
	height: 36vw;
	background: center / cover no-repeat url("../../img/business_arena/desktop/profitability-image.jpg")
}

.qua-hor.wrap-prof .wrap-lr .wrap-main-img {
	width: 41% !important
}

@media screen and (max-width: 1920px) {
	.qua-hor.wrap-prof .wrap-lr .wrap-copy {
		padding: 3vw 0
	}
}

@media screen and (max-width: 1440px) {
	.qua-hor .temp-06-bg {
		height: 47vw
	}
}

@media screen and (max-width: 1024px) {
	.qua-hor .temp-06-bg {
		height: 33vw
	}

	.qua-hor .temp-06-bg {
		width: 100%;
		height: 33vw;
		background: center / cover no-repeat url("../../img/business_arena/tablet/profitability-image.jpg")
	}

	.wrap-prof .wrap-lr .wrap-copy {
		background-color: #dde2e8
	}
}


.wrap-acce .txt-headline,
.wrap-profundity .txt-headline,
.wrap-prof .txt-headline {
	line-height: 1em
}

.wrap-acce .wrap-txt-left .txt-headline,
.wrap-profundity .wrap-txt-left .txt-headline,
.wrap-prof .wrap-txt-left .txt-headline {
	margin: 0
}

.wrap-acce .wrap-txt-left .txt-index,
.wrap-profundity .wrap-txt-left .txt-index,
.wrap-prof .wrap-txt-left .txt-index {
	margin: 0 0 0 -3%
}

.wrap-acce .btn-more,
.wrap-profundity .btn-more,
.wrap-prof .btn-more {
	-moz-transform: scale(0.8);
	-webkit-transform: scale(0.8);
	-o-transform: scale(0.8);
	-ms-transform: scale(0.8);
	transform: scale(0.8);
	margin-left: -10%
}

.qua-hor.support .wrap-rl .wrap-main-img,
.qua-hor.support .wrap-lr .wrap-main-img{
	width: 53%;
}
.qua-hor.support .wrap-rl .wrap-copy,
.qua-hor.support .wrap-lr .wrap-copy{
	width: 45%;
}

@media screen and (max-width: 1024px) {
	.qua-hor.support .wrap-rl .wrap-main-img,
.qua-hor.support .wrap-lr .wrap-main-img,
.qua-hor.support .wrap-rl .wrap-copy,
.qua-hor.support .wrap-lr .wrap-copy{
	width: 100%;
}
	.qua-hor.support .wrap-rl .wrap-copy {
    background-color: #f2f2f2;
}
    .qua-hor.support.instructor .wrap-rl .wrap-copy {
    background-color: #000;
        padding: 0 0 5rem;
}
     .qua-hor .temp-inst-bg {
    width: 200%;
    height: 43.618vw;
    }
}
@media screen and (max-width: 380px) {
.qua-hor.support .wrap-rl .wrap-main-img {
    height: 0;
    padding-bottom: 9vw;
}
    .qua-hor.support.instructor  .wrap-rl .wrap-main-img {
    height: 0;
    padding-bottom: 17vw;
}
   
}
/*Set your sights on the future of business.*/
.qua-hor .wrap-bg {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1
}

.qua-hor .temp-07-bg {
	width: 100%;
	height: 35.3126vw;
	background: center / cover no-repeat url("../../img/business_arena/desktop/HADO_KV_v8UI_updated.jpg")
}

.qua-hor .temp-07-bg.b {
	width: 100%;
	background: center / cover no-repeat url("../../img/business_arena/desktop/HADO_KV_v8UI_updated2.jpg")
}

.wrap-set .wrap-lr {
	height: 35.3126vw
}

.wrap-set .wrap-lr .wrap-copy {
	width: 41vw !important;
}

.wrap-set .cta-white {
	margin: 0 0 0 1.5em
}

.contact.wrap-set{
	height: auto;
}
@media screen and (max-width: 1500px) {

	.wrap-set .wrap-lr .wrap-copy {
		width: 60vw !important;
	}

	.wrap-set .wrap-lr .wrap-main-img {
		width: 22vw !important;
	}
}

@media screen and (max-width: 1024px) {
	.wrap-set .wrap-lr {
		height: 58vw
	}

	.wrap-set .wrap-lr .wrap-copy {
		width: 80vw !important;
		margin: 0 auto
	}

	.qua-hor .temp-07-bg {
		height: 60vw
	}

	.qua-hor.wrap-set .wrap-lr,
	.qua-hor .wrap-rl {
		flex-flow: column nowrap;
		justify-content: center
	}
}

@media all and (max-width: 415px) {
	.wrap-set {
		height: 62vh
	}

	.wrap-set .cta-white {
		margin: 1.5em 0 0
	}

	.wrap-set .wrap-lr .wrap-copy {
		width: 100vw !important
	}

	.qua-hor .temp-07-bg {
		height: 125vw
	}

	.qua-hor.wrap-set .wrap-lr,
	.qua-hor .wrap-rl {
		flex-flow: column nowrap;
		justify-content: flex-start;
		margin-top: 8vh
	}
}

@media all and (max-width: 380px) {
	.qua-hor .temp-07-bg {
		height: 110vw
	}
}

@media all and (max-width: 320px) {
	.wrap-set {
		height: 62vh
	}
}

/*===モーダル表示のためのcss　*/

.hide-area{/*モーダル表示をする場所をあらかじめ隠す*/
	display: none;
}

.modaal-fullscreen .modaal-content-container{/*full画面の色設定*/
	background: #333;
	color: #fff;
	text-align: center;
}

.modaal-fullscreen .modaal-close{/*ボタンの色、位置*/
	background:none;
	right:20px;
}

/*クローズボタンの×の色変更*/
.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before{
	background:#666;
}

/*キャプション*/
.caption{
    display: block;
    padding: 10px 0;
}

/*===　サムネイル表示のためのcss　*/

.gallerys{/*ベースになるギャラリーを横並びに*/
	display: flex;
    justify-content: center;
	align-items: center;
	height: 100vh;
	flex-wrap: wrap;
}

.gallerys p{
	width:33.333%;
    padding: 0 10px;
	min-width: 250px;
}
@media all and (max-width: 640px) {
		.gallerys p{
	width:49%;
}
	}

/*画像の横幅を100%にしてレスポンシブ化*/
.gallerys img{
	width:100%;
	height:20vw;
	object-fit: cover;
	vertical-align: bottom;/*画像の下にできる余白を削除*/
}
@media all and (max-width: 640px) {
		.gallerys img{
	height:200px;
}
	}