/*----------------------------------------------------------------------------------------------------------------------
ALL SIZE
------------------------------------------------------------------------------------------------------------------------*/

/*-----------------------------------common */

* {
margin: 0;
padding: 0;
}
*, *:before, *:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
html {
font-size: 62.5%;
overflow-x: hidden;
}
body {
font-family: "oswald", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, Osaka, sans-serif;
font-size: 1.4em;
line-height: 1.7;
color: #2b2b2b;
position: relative;
background-color: #fff;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
letter-spacing:0.05em;
}
/*----------------------------------hタグ */

h1, h2, h3, h4, h5, h6 {
letter-spacing: 0.05em;
font-weight : normal;
display: block;
text-align: center;
line-height: 1;
}
h2 {
font-size:3.8rem;
color:#494949;
font-weight:bold;
text-align: left;
margin: 0 auto  0;
padding: 30px 0 10px 0;
}
h2.schedule {
font-size:4rem;
line-height:1.2;
padding:5px 0 10px;
margin-bottom:15px;
border-bottom:2px solid #00ff00;


}
h3 {
font-size: 1.8rem;
text-align: left;
margin-bottom: 30px;
line-height: 1.3;
}

h2.contents_title{
font-size:3.6rem;
text-align:center;
background:url(/openhouse/19/img/xx.png) repeat-x top 75% left 0;
}

h2.contents_title span{
background-color:#fff;
display:inline-block;
padding:0 25px;
}


h4.contents_title_sub{
margin:10px auto 35px;
font-size:1.3rem;
text-align:center;
color:#666;
font-weight:bold;
}



/*-----------------------------------選択色 */
/*::selection	{
background: #ff00ff;
color:#fff;
}

::-moz-selection 	{
background: #ff00ff;
color:#fff;
}*/

/*-----------------------------------画像 */
img {
max-width: 100%;
vertical-align: top;
box-shadow: #000 0 0 0;
}
img, x:-moz-any-link, x:default {
box-shadow: #000 0 0 0;
}
/*-----------------------------------リンク */
a {
cursor: pointer;
color:#ff00ff;
-webkit-backface-visibility: hidden; 
backface-visibility: hidden; 
font-weight: nomal;
text-decoration: underline;
}
a:hover {
color: #00ff00;
text-decoration: underline;
-webkit-transition: 0.2s ease-in-out;
-moz-transition: 0.2s ease-in-out;
-o-transition: 0.2s ease-in-out;
transition: 0.2s ease-in-out;
}
a img {
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
-webkit-backface-visibility: hidden;
backface-visibility: hidden; 
}
a:hover img {
opacity: 0.7;
filter: alpha(opacity=70);
}
/*-----------------------------------block要素 */

.ContentsBlock {
overflow: hidden;
max-width: 100%;
word-break: break-all;

}
.textBlock {
padding: 0;
max-width: 960px;
width: 80%;
margin: 0 auto;
overflow: hidden;
}
.titleBlock {
background: #cecece;
width: 100%;
}
.titleBlock_gr {
background: #ff00ff;
width: 100%;
}
.cont {
margin: 0 auto 55px;
}
.cont:last-child {
margin-bottom: 0;
}
/*-----------------------text */

.time {
margin-bottom: 35px;
line-height: 1;
}
.description {
margin-bottom: 20px;
}
ul.way li {
margin-bottom: 20px;
}
/*-----------------------scrolltop */
#back-top {
position: fixed;
bottom: 5%;
right:6%;
}
#back-top span {
width: 25px;
height: 35px;
display: block;
}
/*----------------------header */

header {
position: relative;
height: auto;
overflow: hidden;

}
header h1 {
z-index: 1000;
position: absolute;
top: 52%;
left: 53%;
margin-right: -50%;
-webkit-transform: translate(-50%, -50%); /* Safari用 */
transform: translate(-50%, -50%);
max-width: 1200px;
width: 100%;
}



/*-----------------------navigation */
.mobile_menu {
display: block;
position: relative;
height: 100%;
background:#fff;
}
.acordion {
margin: 0;
padding: 0;
position: fixed;
width: 100%;
top: 3%;
right: 3%;
text-align: right;
width: 40px;
height: 30px;
}
.acordion ul {
margin: 0;
border: none;
}
.acordion ul li {
font-weight: bold;
font-size: 18px;
width: 100%;
text-align: center;
}

.acordion ul li span{font-size: 14px;}

.acordion ul li a {
position: relative;
display: inline-block;
padding: 10px 0 5px;
margin-bottom:15px;
text-decoration: none;
color:#fff;
}
.acordion ul li a::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
background-color: #fff;
-webkit-transform: scaleX(0);
-ms-transform: scaleX(0);
transform: scaleX(0);
-webkit-transition: all .3s ease;
transition: all .3s ease;
}

.acordion ul li a:hover {color:#fff;}

.acordion ul li a:hover::after {
-webkit-transform: scaleX(1);
-ms-transform: scaleX(1);
transform: scaleX(1);}

.submenu {
overflow-x: hidden;
position: fixed;
left: 0;
top: 0;
z-index: 300000;
width: 100%;
height: 100%;
padding-top: 30px;
background: rgba(238,42,210,1);
color: #fff;
display:none;
}


.submenu_inner{
/*	background:orange;*/
/*	position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;*/

position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
margin: 45px auto;
width:80%;
}



nav {
position: fixed;
top: 0;
right: 0;
z-index: 1000000;
}

ul.menu{
width: 90%;
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit- transform: translateY(-50%) translateX(-50%);
}

.trigger, .trigger span {
display: inline-block;
transition: all .2s;
box-sizing: border-box;
}
.trigger {
position: relative;
width: 34px;
height: 30px;
z-index: 10000000;
}
.trigger span {
position: absolute;
left: 0;
width: 100%;
height: 2px;
background-color: #f430d7;
}
.trigger span:nth-of-type(1) {top: 0;}
.trigger span:nth-of-type(2) {top: 38%;}
.trigger span:nth-of-type(3) {top: 76%;}
.trigger span:nth-of-type(4) {bottom: -5px; background:none; font-size: 12px; color: #f430d7; text-align:center;}

/*.trigger span:nth-of-type(1),
.trigger span:nth-of-type(3) {
-webkit-transform: translate(-5px,0);
transform: translate(-5px,0);
}
.trigger span:nth-of-type(2) {
-webkit-transform: translate(5px,0);
transform: translate(5px,0);
}
*/
.trigger span:nth-of-type(1),
.trigger span:nth-of-type(2),
.trigger span:nth-of-type(3)
{-webkit-transform: translate(0,0);
transform: translate(0,0);
}

#menu05 span:nth-of-type(2)::after {
position: absolute;
top: 0;
left: 0;
content: '';
width: 100%;
height: 2px;
background-color: #0414141;
transition: all .2s;
}
#menu05.active span:nth-of-type(1) {
transform: translateY(20px) scale(0);
background-color: #fff;
}
#menu05.active span:nth-of-type(2) {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
background-color: #fff;
}
#menu05.active span:nth-of-type(2)::after {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
background-color: #fff;
}
#menu05.active span:nth-of-type(3) {
transform: translateY(-20px) scale(0);
background-color: #fff;
}

#menu05.active span:nth-of-type(4) {color: #fff;}
#header{display: none !important;}

.btnMenu {
position: fixed;
z-index: 999;
top: 10px;
right: 10px;
width: 40px;
height: 65px;
display: block;
font-size: 30px;
text-align: center;
　overflow: auto;
}
.btnMenu a {
text-align: center;
color: #000;
}
.btnMenu a:hover {color: #878787;}




.menuicon{color: #8cc947;}


.menu_logo, .menu_iamas{
display:block;
}

.menu_logo img{
width:60%;
max-width:500px;
display:block;
margin:0 auto 25px;
}



.menu_iamas img{
width:30%;
max-width:50px;
display:block;
margin:50px auto 0;
}



/*----------------------slider */
/*.bx-viewport {
left: 0;
box-shadow: none;
border: none;
}*/

#slider li {
height: 100vh;
max-height: 940px;
background: center / cover no-repeat;
width:100%;
}

/*
#slider li {
-webkit-transform: -webkit-scale(1.15);
-ms-transform: -ms-scale(1.15);
transform: scale(1.15);
}

#slider li  {
-webkit-animation: zoom 5s linear;
animation: zoom 10s linear;
}
@-webkit-keyframes zoom {
0% {
-webkit-transform: -webkit-scale(1);
-ms-transform: -ms-scale(1);
transform: scale(1);
}

100% {
-webkit-transform: -webkit-scale(1.14);
-ms-transform: -ms-scale(1.14);
transform: scale(1.14);
}
}


@keyframes zoom {
0% {
-webkit-transform: -webkit-scale(1);
-ms-transform: -ms-scale(1);
transform: scale(1);
}

100% {
-webkit-transform: -webkit-scale(1.14);
-ms-transform: -ms-scale(1.14);
transform: scale(1.14);
}
}
*/

/*-------------------themeblock*/
/*
.themeblock{
width:80%;
margin:0;
background-color:#f7f7f7;
}*/



.schedule_date{
font-size:1.6rem;
padding-left:0px;
}
/*.themetop::after{
position: absolute;
top: -80px;
right: -200px;
background-color: #f7f7f7;
content: '';
height: calc(32% + 20px);
width: calc(100% - 5.55554vw + 80px);
z-index:-10;

}
*/

/*-------------------shingaku*/

#shingaku p{margin:30px auto 60px;}


/*-------------------exhibit*/

.pj_block {
padding-bottom: 35px;
margin-bottom: 35px;
text-align: justify;
text-justify: inter-ideograph;

}
.pj_block:last-child {
border-bottom: none;
}
.pj_block img {
margin-bottom: 25px;
}
h4.pj_title {
text-align: left;
line-height: 1.6;
font-size: 18px;
margin-top: -3px;
margin-bottom: 20px;
font-weight:bold;
}

.pj_time {
margin-top: 10px;
margin-bottom:20px;
font-size:13px;
padding:8px 0;
border-top:#b7b7b7 dotted 1px;
border-bottom:#b7b7b7 dotted 1px;
}

.p_box{
overflow: hidden;
position: relative;}

span.pj_label{
position: absolute;
top:0;
left:0;
/*	background: #897F80;*/
z-index: 10000;
font-size:12px;
font-weight: bold;
color:#fff;
background-color: rgba(255,18,255,0.75);
padding:3px 7px;}

#exhibit span.pj_label{	background-color: rgba(0,255,0,0.8);}


.pj_name{
font-size: 13px;
color: #8d8d8d;
color:#ff6cff;
position: relative;
margin-bottom: 10px;}

.pj_desc{
line-height:1.8;
}

/*----------------------access */

.flexbox{
display:flex;
}

.accessleft{
width:50%;
padding:3%;
float:left;
}

.accessright{
width:50%;
float:right;
min-height:100%;
overflow:hidden;
}

.accessbox {margin-bottom: 60px;}

.accessbox:last-child{margin-bottom:0;}

.ggmap {
position: relative;
padding-bottom:130%;
/*	padding-top: 250px;*/
height: 0;
overflow: hidden;
margin: 30px 0 0;
}

.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;}

#access h3{font-weight:bold;}





/*-------------------footer*/
.footer {
background: #e8e8e8;
width: 100%;
padding:30px 0;
}

.footer .textBlock{margin-bottom:0;}

.footer_logo{
width:36%;
max-width:330px;
float:left;
}


ul.footer_info{
margin-left:42%;
}

ul.footer_info li{
margin-bottom:5px;
}


/*----------------------button */
.button {
display: inline-block;
font-family: 'Helvetica Neue', 'Arial' '游ゴシック', YuGothic, 'ヒラギノ角ゴ ProN W3', "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, 'MS Pゴシック', 'MS PGothic', sans-serif;
width: 100%;
height: auto;
text-align: center;
text-decoration: none;
outline: none;
position: relative;
z-index: 2;
border: 1px solid #666;
color: #666;
font-size: 14px;
background-color: none;
overflow: hidden;
margin-bottom: 40px;
letter-spacing: 2px;
font-weight: bold;
padding: 15px 0;
}
.button::before, .button::after {
position: absolute;
z-index: -1;
display: block;
content: '';
}
.button:hover {
color: #fff;
text-decoration:none;
background-color: #ff00ff;
border: 1px solid #ff00ff;
}
.button::after {
top: -100%;
width: 100%;
height: 100%;}

.button:hover::after {top: 0;}


div.notice{
width: 93%;
padding: 30px;
background: #f0f0f0;
text-align: center;
font-size: 18px;
border:1px solid #f0f0f0;
margin: 10px auto 55px;
float: right;
}

.notice a{color: #ff0000;}


.notice a:hover{text-decoration: none;}




/*----------------------------------------------------------------------------------------------------------------------
under 767px sp
------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:767px) {
/*-----------------------------------block要素*/
.ContentsBlock {
max-width: 100%;
}
.textBlock {
width: 90%;
margin: 20px auto 45px;
/*		padding-top: 15px;*/
}
#access h3 {
margin-bottom: 20px;
}
#access .cont {
margin-bottom: 50px;
}
.left, .right {
float: none;
margin: 0 auto 50px;
display: block;
}
/*-----------------------------------header*/
header h1 {
width: 85%;
}
#slider li {
max-height: 220px; /*高さの指定*/
}

/*-----------------------------------hタグ*/

h2 {
width: 90%;
}
h2.schdule {
font-style: 1.7rem;
/*		font-weight: bold;
*/		width: 90%;
padding: 25px 0 25px;
line-height: 1.5;
text-align: center;

}

h2.contents_title{
font-size:3rem;
}

/*-----------------------------------menu */


.submenu_inner{
width:100%;
}

.acordion ul{
overflow: hidden;
width:100%;
margin:0 auto 30px;
}

.acordion ul li {
font-weight: bold;
width: 50%;
text-align: center;
float:left;
border-bottom:1px solid #fff;
border-box:box-sizing;
}

.acordion ul li a{
font-size: 14px;
}

.acordion ul li:first-child,
.acordion ul li:nth-child(2){
border-top:1px solid #fff;
}

.acordion ul li:nth-child(odd){
border-right:1px solid #fff;
}


.menu_logo img{
width:70%;
margin:0 auto 30px;
}

.menu_iamas img{
width:20%;
max-width:40px;
display:block;
margin:30px auto 0;
clear:both;
}




/*-----------------------------------footer*/

.footer_logo{
width:100%;
max-width:330px;
float:none;
margin-bottom:20px;
}


ul.footer_info{
margin-left:0;
}

ul.footer_info li{
margin-bottom:5px;
}




/*-------------------timetable*/

.title{
float: none;
margin-bottom: 20px;
text-align: center;
}


h2.schedule{
text-align: center;
font-size:2.5rem;
}


div.notice{width: 100%;   margin: 10px auto 35px; padding: 10px;}

#theme p {
/*	columns: 1;
column-gap: 6em;*/
letter-spacing: 0.1;
font-weight: bold;
width: 100%;

}


table.time_table {
width: 100%;
overflow: hidden;
}


table.time_table tr {
border-bottom: solid 1px #939393;
}
table.time_table tr.dotted {
border-bottom: dotted 1px #cbcbcb;
}
table.time_table td {
padding: 15px 0 0;
width:100%;
display: block;
}

table.time_table td.time_title {
padding-bottom: 0;
font-size: 18px;}

table.time_table td:last-child {margin-bottom: 25px;}



table.time_table td.blank {
display: none;
}
table.time_table td.title {
font-size: 16px;
}

/*-------------------consultation*/

h5.c_title{
font-size:14px;
background-color:#eee;
text-align: center;
display: block;
width:100%;
padding:10px 0;
margin-bottom:15px;

}
table.consultation{
width:100%;
font-size:13px;
margin-bottom:25px;
}

table.consultation tr{
border-bottom: dotted 1px #cbcbcb;
}

table.consultation td{padding:10px;
height: 165px;}

table.consultation td.c_time{
width:28%;
text-align: center;
border-right: dotted 1px #cbcbcb;
}	


/*----------------------access */

.flexbox{display:block;}

#access img {
width: 100%;
max-width: 100%;
height: auto;
}

/*-----------------------scrolltop */
#back-top {
bottom: 8%;
right:6%;
}
#back-top span {
width: 14px;
height:19px;
display: block;
}


#iamas img{margin-bottom: 30px;}
#iamas .floatleft{margin-bottom:30px;}

#iamas .floatright{margin-bottom: 0;}



/*access*/

.accessleft{width:100%; padding:5%; float:none;}

.accessright{width:100%; float:none;}

.accessbox {margin-bottom: 60px;}

.accessbox:last-child{margin-bottom:0;}

.ggmap {
position: relative;
padding-bottom:25vh;
padding-top: 30px;
height: 0;
overflow: hidden;
margin: 30px 0 0;
}

.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;}

#access h3{font-weight:bold;}


/*-----------------------pc - mobile */

.pc {display: none;}

.sp {display: block;}


}



/*----------------------------------------------------------------------------------------------------------------------
768-1024 ipad
------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width:768px) and ( max-width:1024px) {


.flex{
display: flex;
flex-wrap : wrap;
justify-content:space-between;

}

.pj_block {
padding-bottom: 35px;
margin-bottom: 50px;
width:46%;
}

#iamas img{margin-bottom: 30px;}

#iamas .floatleft{margin-bottom:30px;}

#iamas .floatright{margin-bottom: 0;}

table.consultation{
width:100%;
font-size:13px;
margin-bottom:25px;
}

table.consultation tr{border-bottom: dotted 1px #cbcbcb;}

table.consultation td{padding:10px 10px 10px 20px;
height: 165px;}

table.consultation td.c_time{
width:28%;
text-align: center;
border-right: dotted 1px #cbcbcb;
}	

table.consultation td.c_time br{    display: none;}

.flexbox{display:block;}

.accessleft{
width:100%;
padding:5%;
float:none;
}

.accessright{width:100%; float:none;}

.accessbox {margin-bottom: 60px;}

.accessbox:last-child{margin-bottom:0;}

.ggmap {
position: relative;
padding-bottom:25vh;
padding-top: 30px;
height: 0;
overflow: hidden;
margin: 30px 0 0;
}

.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;}

#access h3{font-weight:bold;}


/*-----------------------pc - mobile */

.pc {display: none;}

.sp {display: block;}

}



/*----------------------------------------------------------------------------------------------------------------------
over 1024px
------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width:1024px) {

.textBlock {margin: 0 auto 60px; padding-top: 35px;}

.left, .right {max-width: 450px; width: 45%;}

.left {float: left;}

.right {float: right;}

/*-----------------------------------menu*/
/*		.mobile_menu{display: none;}
*/

.ContentsBlock {
padding-top: 70px;
margin: -70px auto 0;}

#theme .ContentsBlock {
padding-top: 140px;
margin: -140px auto 0;}


/*-----------------------------------text*/
div.notice br{display: none;}

.title{max-width: 100%; float: left;}

#theme p {
letter-spacing: 0.12em;
line-height:1.8;
font-size:1.5rem;
font-weight: bold;
width: 74%;
margin-top:50px;
float: right;}

/*-------------------timetable*/

table.time_table {
width: 100%;
max-width: 960px;
overflow: hidden;
}

table.time_table tr {border-bottom: solid 1px #939393;}

table.time_table tr.dotted {border-bottom: dotted 1px #cbcbcb;}

table.time_table tr.none {border-bottom:none;}

table.time_table td {padding: 20px 0;}

table.time_table td.time_title {
width: 26%;
max-width: 255px;
padding-right: 10px;
font-size: 16px;
}
table.time_table td.date {
max-width: 260px;
width: 27%;
padding-right: 10px;
}


/*-------------------consultation*/

h5.c_title{
font-size:14px;
background-color:#eee;
text-align: center;
display: block;
width:100%;
padding:10px 0;
margin-bottom:15px;

}

table.consultation{width:100%; font-size:13px; margin-bottom:45px;}

table.consultation tr{border-bottom: dotted 1px #cbcbcb;}

table.consultation td{padding:20px 10px 20px 10px;}

table.consultation td.c_time{
width:28%;
text-align: center;
border-right: dotted 1px #cbcbcb;
}	

table.consultation td.c_time br{    display: none;}

table.consultation td ul li{margin-bottom:3px;}

.floatleft{float: left; width:47%;}

.floatright{float: right; width:47%;}

#iamas .floatleft{width: 58%; line-height: 1.8;}

#iamas .floatright{width: 35%;}

#iamas img{margin-bottom: 40px;}



/*-------------------exhibit*/

.flex{
display: flex;
flex-wrap : wrap;
justify-content:space-between;
word-break: break-word ;
}

.pj_block {
padding-bottom: 35px;
margin-bottom: 50px;
width:29.5%;
}

.pj_block:last-child{margin-bottom: 0;}

.p_box{
overflow: hidden;
position: relative;
width: 100%;
max-width: 450px;
float: none;
margin-bottom: 0;
}

.pj_block img {display: block; width:100%;}

.pj_info {max-width: 470px; width: 100%; float: none;}


/*----------------------access */

#access img {
width:100%;
max-width: 720px;
display: block;
margin: 0 auto;
}

#access img.parking {
width:100%;
max-width: 100%;
display: block;
margin: 0 auto 30px;
}

.pc {display: block;}

.sp {display: none;}

}



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

.title{
float: none;
margin-top:20px;
margin-bottom: 20px;
text-align: center;
width: 100%;
max-width: 100%;
}

#theme p {letter-spacing: 0.1; width: 100%;}


}


/*----------------------------------------------------------------------------------------------------------------------
TOP画像の高さ
------------------------------------------------------------------------------------------------------------------------*/

@media screen and (max-width:499px) {
#slider li {max-height: 260px; }
}

@media screen and (min-width:500px) and ( max-width:677px) {
#slider li {max-height: 420px; }
}

@media screen and (min-width:678px) and ( max-width:879px) {
#slider li {max-height: 500px; }
}

@media screen and (min-width:880px) and ( max-width:1110px) {
#slider li {max-height: 650px; }
}