@charset "UTF-8";

@media screen and (max-width:1023px) { 


div.main_title_icon {
  width: 100%;
  height: 80vh;
  position: fixed;
  color: #000000;
  padding: 0 0 50px 0;
}


div.sub_container {
  width: 100%;
  margin: 0 auto;
  padding: 0 0;
  position: relative;
}

div.main_copy_b {
  width: 22vw;
  position: relative;
  margin:  0 auto 50px auto;
  padding: 21vh 0 0 0;
  opacity: 0;
}

div.main_copy_c {
  width: 100%;
  position: relative;
  margin:  0 auto 50px auto;
  padding: 1vh 0 0 0;
}

p.main_copy_b {
  font-size: 2.4vw;
  font-weight: 400;
  line-height: 1.4em;
  letter-spacing: 0px;
  color: #ffffff;
  text-align: center;
  font-family: 'Noto Serif Japanese', serif, sans-serif;
}

div.back_item_center1000 {
  width: 100%;
  position: relative;
  margin: 0 auto;
  padding: 0 5%;
} 

div.back_item_left800 {
  width: 90vw;
  position: relative;
  margin: 0 auto 0 0;
  padding: 0 0 0 0;
} 

div.back_item_left600 {
  width: 600px;
  position: relative;
  margin: 0 auto 0 10vw;
  padding: 0 0 0 0;
} 

div.back_item_center800 {
  width: 90vw;
  position: relative;
  margin: 0 auto 0 auto;
  padding: 0 0 0 0;
} 

div.back_item_center900 {
  width: 90vw;
  position: relative;
  margin: 0 auto 0 auto;
  padding: 0 0 0 0;
} 

div.back_item_center300 {
  width: 40vw;
  position: relative;
  margin: 0 auto 0 auto;
  padding: 0 0 0 0;
} 

div.back_item_center900 {
  width: 90vw;
  position: relative;
  margin: 0 auto 0 auto;
  padding: 0 0 0 0;
} 

div.back_item_center200 {
  width: 22vw;
  position: relative;
  margin: 0 auto 0 auto;
  padding: 0 0 0 0;
} 

div.back_item_center600 {
  width: 90vw;
  position: relative;
  margin: 0 auto 0 auto;
  padding: 0 0 0 0;
} 

div.back_item_center400 {
  width: 60vw;
  position: relative;
  margin: 0 auto 0 auto;
  padding: 0 0 0 0;
} 

div.back_item_left400 {
  width: 40vw;
  position: relative;
  margin: 0 auto 0 0;
  padding: 0 0 0 0;
} 

div.back_item_left {
  width: 60vw;
  position: relative;
  margin: -7vw auto 0 0;
  padding: 0 0 0 0;
} 

.hoverbox:hover {
    opacity: 1.0;
  }

div.wrapper {
  width: 100%;
  margin: 0 auto;
  position: relative;
}

div.page_outer {
  width: 100%;
  height: auto;
  margin: 0 auto;
  position: relative;
  background-color: #000000;
  z-index: 1;
}

.logo_box01 {
  position: absolute;
  width: 120px;
  top: 20px;
  left: 20px;
  z-index: 100;
}

div.main_container {
  overflow: hidden;
  width: 100%;
  margin: 0 auto;
  position: relative;
}

div.main_title_logo {
  width: 38vw;
  position: relative;
  margin: 0 auto;
  padding: 0 0 0 0;
}

img.image_logo {
  width: 50vw;
}

div.main_copy_a2_ab {
  width: 60vw;
  position: absolute;
  top: 10vh;
  left: 50;
  -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  opacity: 0;
}

div.main_title_logo_ab {
  width: 42vw;
  position: absolute;
  top: 12vh;
  left: 0;
  right: 0;
  margin: auto;
  opacity: 0;
}


div.contents_container {
  width: 100%;
  margin: 0 auto;
  padding: 0 0 0 0;
  position: relative;
  overflow: hidden;
 }

div.main_title {
  width: 100%;
  height: 90vh;
  margin: 0 auto;
  position: relative;
  text-align: center;
    background-image: url(../img/back01_sp.jpg);
  background-size: cover;
}

div.main_box {
  width: 100%;
  margin: 0 auto 0 auto;
  padding: 0 0 0 0;
  position: relative;
  text-align: center;
}
	
div.main_copy_a {
  overflow: hidden;
  width: 60vw;
  position: relative;
  margin:  0 auto 0 auto;
  padding: 0 0 0 0;
}

div.main_copy_a2 {
  overflow: hidden;
  width: 100%;
  position: relative;
  margin:  0 auto 0 auto;
  padding: 1vh 0 2vh 0;
}
	
div.main_copy {
  overflow: hidden;
  width: 100%;
  position: relative;
  margin: 10px auto;
}

p.main_copy_a {
  font-size: 4.8vw;
  font-weight: 400;
  line-height: 1.4em;
  letter-spacing: 0px;
  color: #ffffff;
  text-align: center;
  margin: 0 0 0 0;
}

p.main_copy_a2 {
  font-size: 4.8vw;
  font-weight: 400;
  line-height: 1.4em;
  letter-spacing: 0px;
  color: #ffffff;
  text-align: center;
  margin: 0 0 0 0;
}

p.main_copy {
  font-size: 2.8vw;
  font-weight: 400;
  line-height: 2.2em;
  letter-spacing: 0.2em;
  color: #ffffff;
  text-align: center;
  margin: 0 0 0 0;
}

div.sub_copy {
 width: 70%;
 position: relative;
 margin:  0 auto;
 padding: 0 0 0 0;
 z-index: 100;
}

div.sub_copy700 {
 width: 80vw;
 position: relative;
 margin:  0 auto;
 padding: 0 0 0 0;
 z-index: 100;
}


div.sub_copy900 {
 width: 100%;
 position: relative;
 margin:  0 auto;
 padding: 0 0 0 0;
 z-index: 100;
}


div.top_slider_container {
  width: 100%;
  margin: 0 auto 0 auto;
  position: relative;
  text-align: center;
}

div.link_container {
  width: 100%;
  margin: 8vw auto;
  position: relative;
  text-align: center;
}

img.image_common {
  width: 100%;
}

img.image_90 {
  width: 90%;
}


div.spsw {
  display: block;
}

div.pcsw {
  display: none;
}

br.PConly {
  display: none;
}

br.SPonly {
  display: block;
}

div.menu_caption {
  width: 100%;
  margin: 4vw auto 8vw auto;
  position: relative;
  text-align: center;
}
	
p.menu_caption {
  font-size: 3.2vw;
  font-weight: 400;
  line-height: 1.4em;
  letter-spacing: 0px;
  color: #000;
  text-align: center;
  margin: 0 0 4vw 0;
}

.flex_container {
   position: relative;
	width:80vw;
	margin: 0 auto;
	padding:0;
	display:flex;
	display:-moz-flex;
	display:-o-flex;
	display:-webkit-flex;
	display:-ms-flex;
	justify-content:space-between;
	-moz-justify-content:space-between;
	-o-justify-content:space-between;
	-webkit-justify-content:space-between;
	-ms-justify-content:space-between;
	flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-o-flex-wrap:wrap;
	-webkit-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
}

.comment_container {
  width: 90vw;
  position: relative;
  margin: 0 auto;
  padding: 0 2vw 2vw 2vw;
  background-color: #ffffff;
}

.flex_box_left {
  position: relative;
  width: 100%;
  margin: 0 0 0 0;
}

.flex_box {
  position: relative;
  width: 50%;
  margin: 0 0 0 0;
}

.comment_flex_box_left {
  position: relative;
  width: 100%;
  margin: 0 0 0 0;
}

.comment_flex_box_left_b {
  position: relative;
  width: 60%;
  margin: 0 auto;
}

.comment_flex_box_left_c {
 position: relative;
  width: 80%;
  margin: 0 auto;
}

.flex_box_a {
  position: relative;
  width: 38%;
  margin: 0 auto;
}

.flex_box_center {
  position: relative;
  width: 100%;
  margin: 0 auto;
}


.flex_box_right {
  position: relative;
  width: 80vw;
  margin: 0 10vw;
}

.comment_flex_box_right {
  position: relative;
  width: 100vw;
  margin: 0 0;
}

.comment_flex_box_right_b {
  position: relative;
  width: 100%;
  margin: 0 0;
}

.comment_flex_box_right_c {
  position: relative;
  width: 100%;
  margin: 0 0;
}

div.page_item_a {
  width: 80%;
  position: relative;
  margin: 0 auto;
  padding: 0 0 0 0;
}

div.comment_item_a {
  width: 100%;
  position: relative;
  margin: 0 0 0 auto;
  padding: 0 0 0 0;
}

div.comment_item_b {
  width: 100%;
  position: relative;
  margin: 0 auto 0 0;
  padding: 0 0 0 0;
}

div.page_item_b {
  width: 90vw;
  position: relative;
  margin: 5px auto;
  padding: 0 0 0 0;
}

div.page_item_d {
  width: 75vw;
  position: relative;
  margin: 5px auto;
  padding: 0 0 0 0;
}

div.page_item_c {
  width: 90vw;
  position: relative;
  margin: 5px auto;
  padding: 0 0 0 0;
}

div.comment_pic_a {
  width: 20vw;
  position: relative;
  margin: 5px auto 0 auto;
  padding: 0 0 0 0;
}

div.page_item_up {
  width: 90vw;
  position: absolute;
  top: 0;
  left: 0;
}

div.back_item_right {
  width: 100%;
  position: relative;
  margin: -20vw auto 20vw 0;
  padding: 0 0 0 0;
}

div.back_item_right300 {
  width: 100%;
  position: relative;
  margin: -33vw auto 0 0;
  padding: 0 0 0 0;
}

div.back_item_right5 {
  width: 100%;
  position: relative;
  margin: -5vw auto 0vw 0;
  padding: 0 0 0 0;
}

div.back_item_right_500 {
  width: 100%;
  position: relative;
  margin: -65vw auto 0 0;
  padding: 0 0 0 0;
}

 .slidebox .caption {
	font-size: 3.0vw;
	text-align: center;
	padding-top: 40%;
	color: #fff;
}

.item_caption {
font-size: 2.0vw;
color: #ffffff;
text-align: justify;
}

.caption {
font-size: 1.4vw;
color: #ffffff;
text-align: center;
}


.item_caption_center {
font-size: 3.4vw;
color: #ffffff;
text-align: center;
}

.text_just {
  text-align: justify!important;
}


.item_caption_center_bl {
font-size: 2.8vw;
line-height: 2.2em;
color: #000000;
text-align: center;
}

.item_caption_center30 {
font-size: 4.6vw;
line-height: 1.8em;
color: #ffffff;
text-align: center;
}

.item_caption_center24_bl {
font-size: 3.9vw;
line-height: 1.8em;
color: #000000;
text-align: center;
}

.item_caption_center14_bl {
font-size: 3.2vw;
line-height: 1.8em;
color: #000000;
text-align: center;
}

.item_caption_center22 {
font-size: 3.8vw;
line-height: 1.8em;
color: #ffffff;
text-align: center;
}

div.page_item_pic {
  width: 90%;
  position: relative;
  margin: 0 auto;
  padding: 0 0 0 0;
}

.width800 {
  width: 100%;  
}

.width700 {
  width: 100%;  
}

.width600 {
  width: 100%;  
}

.width500 {
  width: 100%;  
}

.mb_100 {
	margin-bottom: 20vw !important;}
.mb_56 {
	margin-bottom: 10vw !important;}
.mb_40 {
	margin-bottom: 8vw !important;}
.mb_24 {
	margin-bottom: 4vw !important;}
.mb_12 {
	margin-bottom: 2vw !important;}

.text_left {
 text-align: left;
} 


.text_left_pc {
 text-align: center;
} 



.font_size14 {
  font-size: 3.2vw
}

.font_size16 {
  font-size: 3.4vw;
}
.font_size18 {
  font-size: 3.5vw;
}
.font_size20 {
  font-size: 3.6vw;
}
.font_size22 {
  font-size: 3.8vw;
}
.font_size24 {
  font-size: 4.0vw;
}
.font_size26 {
  font-size: 4.2vw;
}

.font_size28 {
  font-size: 4.4vw;
}

.font_size38 {
  font-size: 6vw;
}

a {
	text-decoration: none!important;
  }

a:visited {
color:#ffffff;
}

.border_bl {
  width: 96%;
  margin: 0 auto;
  padding: 10px 0;
  border-top: 1px solid #000000; 
}

div.backtop {
  width: 8%;
  position: fixed;
  bottom: 2%;
  right: 2%;
  transition: 0.4s;
  opacity: 0.7;
  z-index: 150;
}

}



















@media screen and (max-width:768px) { 

div.page_outer {
  width: 100%;
  height: auto;
  margin: 0 auto;
  position: relative;
  background-color: #000000;
  z-index: 1;
}

div.main_title_logo {
  width: 34vw;
  position: relative;
  margin: 0 auto;
  padding: 0 0 0 0;
}

div.main_title_logo_ab {
  width: 44vw;
  position: absolute;
  top: 10vh;
  left: 0;
  right: 0;
  margin: auto;
}
div.main_copy_b {
  width: 28vw;
  position: relative;
  margin:  0 auto 50px auto;
  padding: 20vh 0 0 0;
  opacity: 0;
}



div.copy_box {
  width: 100%;
  height: 50vw;
  margin: 10vw auto 30vw auto;
  position: relative;
}

div.main_title {
  width: 100%;
  height: 90vh;
  margin: 0 auto;
  position: relative;
  text-align: center;
    background-image: url(../img/back01_sp.jpg);
  background-size: cover;
}

div.main_copy_a {
  overflow: hidden;
  width: 55vw;
  position: relative;
  margin: 0 auto;
  padding: 0 0 0 0;
}

div.main_copy_a2_ab {
  width: 55vw;
  position: absolute;
  top: 10vh;
  left: 50;
  -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  opacity: 0;
}

div.main_copy_a2 {
  overflow: hidden;
  width: 100%;
  position: relative;
  margin: 0 auto;
  padding: 1vh 0 2vh 0;
}

div.main_copy {
  overflow: hidden;
  width: 100%;
  position: relative;
  margin: 18px auto;
}

p.main_copy_a {
  font-size: 4.4vw;
  font-weight: 400;
  line-height: 1.4em;
  letter-spacing: 0px;
  color: #ffffff;
  text-align: center;
  margin: 0 0 0 0;
}

p.main_copy_a2 {
  font-size: 4.2vw;
  font-weight: 400;
  line-height: 1.4em;
  letter-spacing: 0px;
  color: #ffffff;
  text-align: center;
  margin: 0 0 0 0;
}

p.main_copy {
  font-size: 3.8vw;
  font-weight: 400;
  line-height: 2.2em;
  letter-spacing: 0.2em;
  color: #ffffff;
  text-align: center;
  margin: 0 0 0 0;
}

div.back_item_center600 {
  width: 90vw;
  position: relative;
  margin: 0 auto 0 auto;
  padding: 0 0 0 0;
} 

div.back_item_center400 {
  width: 50vw;
  position: relative;
  margin: 0 auto 0 auto;
  padding: 0 0 0 0;
} 

div.back_item_left400 {
  width: 50vw;
  position: relative;
  margin: 0 auto 0 0;
  padding: 0 0 0 0;
} 

div.back_item_left600 {
  width: 70vw;
  position: relative;
  margin: 0 auto 0 10vw;
  padding: 0 0 0 0;
} 

div.back_item_right {
  width: 100%;
  position: relative;
  margin: -20vw auto 20vw 0;
  padding: 0 0 0 0;
}

.flex_container {
   position: relative;
	width:80vw;
	margin: 0 auto;
	padding:0;
	display:flex;
	display:-moz-flex;
	display:-o-flex;
	display:-webkit-flex;
	display:-ms-flex;
	justify-content:space-between;
	-moz-justify-content:space-between;
	-o-justify-content:space-between;
	-webkit-justify-content:space-between;
	-ms-justify-content:space-between;
	flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-o-flex-wrap:wrap;
	-webkit-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
}


br.sp_only {
  display: block;
}

br.pc_only {
  display: none;
}


.text_left_sp {
 text-align: left;
} 


}
























@media (max-width: 559px) {

div.main_title {
  width: 100%;
  height: 90vh;
  margin: 0 auto;
  position: relative;
  text-align: center;
    background-image: url(../img/back01_sp.jpg);
  background-size: cover;
}

div.copy_box {
  width: 100%;
  height: 80vw;
  margin: 25vw auto 30vw auto;
  position: relative;
}

div.main_copy_a {
  overflow: hidden;
  width: 85vw;
  position: relative;
  margin: 0 auto;
  padding: 2vh 0 0 0;
}

div.main_copy_a2_ab {
  width: 85vw;
  position: absolute;
  top: 10vh;
  left: 50;
  -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  opacity: 0;
}

div.main_copy_a2 {
  overflow: hidden;
  width: 100%;
  position: relative;
  margin: 0 auto;
  padding: 1vh 0 2vh 0;
}

p.main_copy_a {
  font-size: 6.6vw;
  font-weight: 400;
  line-height: 1.4em;
  letter-spacing: 0px;
  color: #ffffff;
  text-align: center;
  margin: 0 0 0 0;
}

p.main_copy_a2 {
  font-size: 6.4vw;
  font-weight: 400;
  line-height: 1.4em;
  letter-spacing: 0px;
  color: #ffffff;
  text-align: center;
  margin: 0 0 0 0;
}

p.main_copy_b {
  font-size: 3.4vw;
  font-weight: 400;
  line-height: 1.4em;
  letter-spacing: 0px;
  color: #ffffff;
  text-align: center;
  font-family: 'Noto Serif Japanese', serif, sans-serif;
}

div.main_title_logo {
  width: 50vw;
  position: relative;
  margin: 0 auto;
  padding: 0 0 0 0;
}

div.main_title_logo_ab {
  width: 66vw;
  position: absolute;
  top: 10vh;
  left: 0;
  right: 0;
  margin: auto;
}

div.main_copy_b {
  width: 37vw;
  position: relative;
  margin:  0 auto 50px auto;
  padding: 15vh 0 0 0;
}

.text_left_sp {
 text-align: left;
} 

br.sp_only {
  display: block;
}

br.pc_only {
  display: none;
}



}