@charset "UTF-8";

/* common */

* {margin:0;}
.content {
    max-width:1000px;
    margin-left:auto;
    margin-right:auto;
    padding-top:1px;
    position:relative;}

ul {
    list-style:none;
    padding:0;}
ul li {
    text-indent:0;
    margin-left:0;}

p {font-size:16px;}

.flex {
    display:flex;}

/* main */

#main {
    background-image:url("img/main_back.png");
    background-size:cover;
    background-position:bottom;
    width:100%;
    padding:1px 0 10% 0;
    position:relative;}
h1 {
    margin: 60px auto 0 auto;
    text-align:center;}
.sub_ttl {
    background-image:url("img/sub_ttl.png");
    width:100%;
    max-width:754px;
    min-height:62px;
    color:#1454ab;
    font-size:29px;
    font-weight:bold;
    line-height: 2;
    text-align:center;
    margin:0 auto;}
.main_right {
    top:50px;
    right:50px;
    position:absolute;
    writing-mode:vertical-rl;}

.main_right p {
    color:#ffffff;
    font-size:18px;
    background-color:rgba(22,93,181,1.00);
    box-shadow:8px 10px 0 rgba(0,21,91,0.70);
    padding:20px 10px 25px 10px;
    letter-spacing:0.2em;
    display:inline-block;
    }

.main_right p+p {
    margin:245px 8px 0 0;}

.date {
    color:#ffffff;
    margin-top:30px;
    text-shadow:4px 4px 0 rgba(4,46,158,1.00);
    font-size:90px;
    text-align:center;
    font-family:"DINEngschrift LT Alternate", "DIN", "Oswald", sans-serif;}

.date span {
    font-size:60%;
}

.place {
    font-size:29px;
    color:#ffffff;
    font-weight:bold;
    text-align: center;
    text-shadow:4px 4px 0 rgba(4,46,158,1.00);
    }

.place span {
    background-color:#ffffff;
    color:#1454ab;
    text-shadow:none;
    box-shadow:3px 3px 0 rgba(4,46,158,1.00);
    display:inline-block;
    padding:3px 20px;
    line-height:1;
    font-size:24px;
    margin-right:20px;}

/* what */

#what ul {
    position:relative;
}

#what ul li img {
    box-shadow:10px 30px 10px rgba(0,0,0,0.2);
    margin:0;
    }

#what ul li:first-child {
    position:absolute;
    left:-100px;
    top:-230px;
    z-index:3;}

#what ul li:nth-child(2) {
    position:absolute;
    left:0px;
    top:0px;
    z-index:2;}

#what ul li:nth-child(3) {
    position:absolute;
    right:-100px;
    top:-150px;
    z-index:1;}
.what_box {
    width:480px;
    display:block;
    margin:50px 0 0 auto;}

#what h2 {
    color:#0953b8;
    font-size:42px;
    letter-spacing:0.2em;
    position:relative;
    margin-bottom:50px;}

#what h2 span {
    font-size:32px;}

#what h2:after {
    content:"";
    height:8px;
    background-image:url("img/title_back01.gif");
    width:47%;
    position:absolute;
    bottom:-30px;
    left:0;}

#what p {
    line-height:2;
    font-size:16px;}


/* Event  merit */

#event {
    background-image: url("img/event_back.png");
    background-size:100% 100%;
    width:100%;
    padding:7% 0 0 0;
    min-height:929px;
}

#event p {
    color:#ffffff;
    margin:140px 0 0 0;}
.event_txt {
    font-size:18px;
    letter-spacing: 0.1em;
}
.merit_box {
    position:relative;
    z-index:2;
    background-image:url("img/merit_box.png");
    width:606px;
    padding-top:1px;
    aspect-ratio:606 / 407;
    margin:30px 0 0 -40px;}

.merit_box+img {
    position:absolute;
    z-index:1;
    margin-top:35px;
    right:0;}

.merit_box h4 {
    margin: 116px 0 0 30px;
    transform: rotate(-16deg);
    color: #ffffff;
    width: 210px;
    font-size: 160%;
    letter-spacing:0.2em;
    text-align: center;}

#event .merit_box p {
    color:#000000;
    margin:40px 0 0 110px;
    letter-spacing: 0.1em;
    line-height: 1.8;}

#event .flex {
    
}


/* schedule */

.booth_area {
    flex-wrap:wrap;
    gap:2%;}

.booth {
    width:32%;}

#schedule h2 {
    font-size:32px;
    color:#0953b8;
    text-align:center;
    position:relative;
    letter-spacing:0.1em;
    margin-bottom:60px;}

#schedule h2 span {
    position:absolute;
    z-index:-1;
    font-size:155px;
    top:17px;
    left:0;
    right:0;
    line-height:0;
    font-weight: 400;
    color:rgba(231,248,255,1.00);}


.floor_ttl {
    font-size:80px;
    display:block;
    position:relative;
    font-family:"DINEngschrift LT Alternate", "DIN", "Oswald", sans-serif;
    text-align:center;
    color:#0953b8;}

.floor_ttl:before {
    content: "";
    width: 150px;
    left: 42%;
    top: 50%;
    background-color: #ffffff;
    position: absolute;
    z-index: -1;
    height: 20px;}

.floor_ttl:after {
    content:"";
    width:100%;
    top:50%;
    position:absolute;
    left:0;
    z-index:-2;
    height:8px;
    background-image:url("img/title_back01.gif");    
}

.event_ttl {
    background-image: url("img/schedule_ttl.png");
    background-size:100% 100%;
    min-height:62px;
    margin:30px 0 50px 0;
}

.event_ttl span {
    font-size:36px;
    color:#0953b8;
    font-weight:normal;
    vertical-align: middle;
    margin:4px 55px 0 25px;
    display:inline-block;}

.event_ttl span+span {
    color:#ffffff;
    font-size:22px;
    vertical-align: middle;
	max-width:650px;
	line-height:1.2;
    margin:0px 0 0 0;
    }

.type {
/*    color:#0953b8;*/
    font-size:13px;
    margin:10px 0 2px 0;}

.booth a {
	text-decoration:none;
	color:inherit;}
.booth img {
	max-width:310px;
	border:1px solid gray;}
.booth h4 {
    color:#0953b8;
	text-align:center;
    font-size:20px;}

.booth h4+p {
    font-size:14px;
    margin:15px 0 0 0;
    line-height:1.7;}

.booth {margin-bottom:40px;}

.f2_txt {
    font-size:20px;
    margin:0 0 40px 0;}

.seminar_box {
    position:relative;
    margin-bottom: 20px;
    align-items: flex-start;}

.seminar_txt {
    margin-left:20px;
    width:710px;}

p.time {
    font-weight:bold;
    color:#4d4d4d;
    font-size:20px;
    margin:-10px 0 10px 0;
}

.profile h5 {
    font-size:18px;
    font-weight:bold;
    color:#3b3b3b;}

.profile .name {
    color:#0953b8;
    font-size:22px;
    margin:5px 0 20px 0;
    font-weight:bold;}

.profile {
    border-left:1px solid #000;
    padding-left:20px;
    margin-left:10px;
    min-height: 180px;}

.num {
    position:absolute;
    right:0;
    top:30%;
    line-height:0;
    font-size:140px;
    color:rgba(231,248,255,1.00);
    font-family:"DINEngschrift LT Alternate", "DIN", "Oswald", sans-serif;
    z-index:-1;
}

.profile_txt {
    font-size:14px;
}

.prof_pic {
    width:200px;}

.seminar_txt2 h5 {
    margin-bottom:20px;}

.seminar_txt2 .profile_txt+.name {
    margin-top:100px;
}

.seminar_txt2 .profile {
    min-height:400px;
}

/* contact */

#contact {
    margin-top:70px;
}

#contact a {
    display:block;
    margin:0 auto 0 auto;
    width:100%;
    max-width:846px;
    transition:0.3s;}

#contact a:hover {
    opacity:0.8;
    transition:0.3s;}

footer {
    background-color:rgba(32,121,222,1.00);
    color:#ffffff;
    padding:30px 0;
    font-size:13px;
    margin-top:100px;
    text-align:center;
}

.comesoon {
	font-size:50px;
	color:#0953b8;
	margin:100px 0;
	width:100%;
	text-align:center;}



/* スマートフォンサイズ */
@media screen and (max-width:768px){

p {
	font-size:15px;
	line-height:1.4;}

.forpc {display:none;}

img {max-width:100%;}


.booth_area.flex {
	width:94%;
	margin-left:auto;
	margin-right:auto;}

.booth {
	width:48%;
	text-align:center;}

.booth h4+p {
	margin:8px 0 0 0;
	font-size:14px;}

.booth img {
	width:100%;}

.booth h4 {
	font-size:16px;}

#schedule h2 span {
	font-size:2.2em;}

#what ul li {
	position:relative!important;
	top:inherit!important;
	left:inherit!important;}

#what ul li:first-child,
#what ul li:last-child {
	display:none;
}

#what ul li img {
    margin: 20px auto 0 auto;
    box-shadow: 10px 10px 0px rgba(0, 0, 0, 0.2);
    width: 90%;
    display: block;
    object-fit: cover;
    height: 230px;}

.what_box {
    width: 92%;
    margin: 30px auto 0 auto;}

#what h2 {
    font-size: 2em;
    letter-spacing: 0;}

#what p {
    line-height: 1.4;
    font-size: 15px;}

.merit_box {
    width: 100%;
    padding-top: 1px;
    margin: 160px 0 0 -23px;}

#event {
    min-height: inherit;}

#event .merit_box p {
    margin: 40px auto 20px 60px;
    letter-spacing: 0;
    line-height: 1.4;
    width: 84%;
	font-size:15px;}

.sub_ttl {
    width: 92%;
    background-size: 100% 100%;
    min-height: 46px;
    font-size: 22px;
    margin: 0 auto;}

.date {
    color: #ffffff;
    margin-top: 20px;
	font-family:sans-serif;
    font-size: 1.9em;}

.place {
    font-size: 1em;
    margin: 10px 0 30px 0;}

.place span {
    font-size: 0.8em;
	margin-right:10px;}

#main {
    background-size: 100% 100%;}


#event p {
    color: #ffffff;
    margin: 100px auto 0 auto;
	font-size:15px;
    letter-spacing: 0;
	line-height:1.4;
	width:92%;}

#schedule {
	margin:40px 0 0 0;}

#schedule h2 {
    font-size: 2em;
	margin-bottom:10px;}

.floor_ttl {
    font-size: 2.5em;}

.floor_ttl:before {
    content: "";
    width: 90px;
    left: 40%;}

.event_ttl span {
    font-size: 0.9em;
    margin: 0 0px 0 0%;
    width: 26%;
    vertical-align: middle;
    text-align: center;
    align-content: center;}

.event_ttl span+span {
    font-size: 0.9em;
    vertical-align: middle;
    margin: 0 0 0 5%;
	text-align:left;
    width: 68%;}

.event_ttl {
    margin: 30px auto 50px auto;
    width: 96%;
	line-height:1.2;
	display:flex;}

.comesoon {
    font-size: 2em;
    color: #0953b8;
    margin: 0 0 10% 0;
    text-align: center;
    display: block;
    width: 100%;}

.f2_txt {
    font-size: 15px;
    margin: 0 auto 40px auto;
    width: 90%;}

#what h2 {
    text-align: center;}

#what h2:after {
    bottom: -15px;
    left: 0;
    right: 0;
    margin: auto;}

.seminar_box {
    margin-bottom: 20px;
    align-items: flex-start;
    display: block;}

.profile img.forsp {
	width:48%;}

.seminar_txt {
    width: 86%;}

.profile h5 {
    font-size: 15.5px;}

.profile .name {
    font-size: 17px;
	margin:10px 0 20px 0;}

.seminar_txt2 .profile_txt+.name {
    margin-top: 20px;}

#contact a img {
    height: 80px;
    object-fit: cover;
    width: 95%;
    border-radius: 5px;
    margin: 0 auto;
    display: block;}

#contact {
    margin-top: 50px;}

footer {
    margin-top: 30px;}

.main_right {
	top:inherit;
	right:inherit;
    position: inherit;
    text-align: center;
    writing-mode: inherit;}

.main_right p+p {
    margin: 0px 0px 0 5px;}

.main_right p {
    font-size: 13px;
    box-shadow: 3px 3px 0 rgba(0, 21, 91, 0.70);
    padding: 5px 10px;
    letter-spacing: 0em;
    display: inline-block;}

footer p {
	font-size:13px;}


}
@media screen and (min-width:769px){
.forsp {display:none;}
}