@charset "utf-8";
/* CSS Document */

body,h1,h2,h3,h4,ul,ol,li,dl,dt,dd,p,table,td,th,div,form,input,textarea,figure,figcaption{
	margin:0;
	padding:0;
	font-weight:normal;
	font-size:100%;
	box-sizing: border-box;
}
html{
	scroll-behavior: smooth;
}
body {
	font-size: 16px;
	font-family:'Noto Sans JP', sans-serif, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
	line-height:1.4;
}

main {
	background-color: #7fcef4;
}

table{
	border-collapse:collapse;
}

ul,ol,li {
	list-style: none;
}

img{
	max-width: 100%;
	height: auto;
	border:none;
	vertical-align:bottom;
}

a.apply_btn {
	display: block;
	width: 590px;
	height: 124px;
	margin: 60px auto 0;
	padding-right: 50px;
	box-sizing: border-box;
	background-color: #fff;
	border: solid 3px #04377b;
	border-radius: 13px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2.125rem;
	font-weight: 700;
	color: #04377b;
	text-decoration: none;
	box-shadow: 4px 4px 0px rgba(13,111,184,0.5);
	position: relative;
}

.for_pc {
	display: block;
}

.for_sp {
	display: none;
}

.for_sp480 {
	display: none;
}


a.apply_btn::after {
	content: "";
    display: block;
    width: 41px;
    height: 41px;
    background: url(../img/icon_arrow_next.png) no-repeat;
    background-size: contain;
    position: absolute;
    top: calc(50% - 20px);
    right: 40px;
}

a.apply_btn:hover {
    background-color: #fbf8a5;
	transition: all 150ms;
}


/*main_visual
---------------------------------------------------------------------*/
#main_visual {
	background:url(../img/bg.svg) no-repeat center 1em / clamp(200px, 110vw, 1400px);
	font-size: clamp(5px, 1.3vw, 16px);
	position: relative;
}
#main_visual > *{
	width: 96%;
	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;
}

#main_visual .lead {
	max-width: 1000px;
	font-size: 1.15em;
}
#main_visual .lead > span{
	display: inline-block;
	padding: 2.5em 2em 4.5em 4em;
	margin-left: -4em;
	background: url(../img/cloud_b.svg) no-repeat left bottom / 100%;
}

#main_visual .lead span span{
	font-size: 1.2em;
	font-weight: 700;
}
#main_visual h1 {
	margin-top: -3.75em;	
	max-width: 1000px;
	position: relative;
	z-index: 1;
}
#main_visual .participation{
	position: relative;
	text-align: right;;
	margin-top: -13em;
	margin-bottom:33em;
	max-width: 1000px;
}
#main_visual .participation span{
	display: inline-block;
	color: #00326c;
	font-size: 1.8em;
	font-weight: 900;
	background: url(../img/cloud_s.svg) no-repeat right bottom / 100%;
	padding: 1.2em 2.2em;
	margin-right: -1.25em;
}

#main_visual .date_venue img{
	width: 100%;
	max-width: 900px;
	margin-bottom: 1em;
}
#main_visual .target img{
	width: 100%;
	max-width: 700px;
}


/*page_link
---------------------------------------------------------------------*/
#page_link {
	background-color: #fff;
	border: solid 3px #0d6fb8;
	margin-top: 2.5em;
	margin-bottom: -2.5em;
	display: grid;
	grid-template-columns: repeat(4,auto);
	justify-content: center;
	gap:4em;
	padding: 1.25em 1.25em 1.875em 2.752em;
}

#page_link li {
	position: relative;
}

#page_link a {
	color: #04377b;
	font-size: 1.5em;
	font-weight: 500;
	text-decoration: none;
	position: relative;
}

#page_link a::before {
	content: "";
    display: block;
    width: 1em;
    height: 1em;
    background: url(../img/icon_arrow_down.png) no-repeat;
	background-size: contain;
    position: absolute;
	top:0.5em;
    left: -1.5em;
}

#page_link a::after {
	content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #fff;
    border-bottom: dashed 2px #04377b;
    position: absolute;
    bottom: -0.3em;
    left: 0;
    right: 0;
    margin: auto;
}


#page_link li a:hover {
	background-color: #fbf8a5;
	border-radius: 0.3em;
	transition: all 150ms;
}


/*section
---------------------------------------------------------------------*/
.section {
	padding: 80px 0 100px;
}

.section h2 {
	max-width: 1200px;
    margin:0 auto 50px;
	padding: 0 20px;
	color:#04377b;
	font-size:3.4rem;
	font-weight: 500;
	text-align:center;
	position: relative;
}

.section h2::after {
	content: "";
	display: block;
	width: 100px;
	height: 5px;
	background-color: #04377b;
	position: absolute;
	left: 0;
	right: 0;
	bottom: -20px;
	margin: auto;
}


/*outline
---------------------------------------------------------------------*/
#outline{
	background-color:#a5dffb;
}

#outline dl {
    max-width: 1000px;
    margin:0 auto 0;
	display: flex;
	gap: 5px;
	flex-wrap: wrap;
}

#outline dt,
#outline dd {
	font-size: 1.375rem;
	padding: 1.125rem 1.25rem;
	box-sizing: border-box;
}

#outline dt {
	width: 240px;
	color: #fff;
	background-color: #0d6fb8;
	text-align: center;
}

#outline dd {
	width: calc(100% - 240px - 5px);
	color: #191919;
	background-color: #fff;
}

#outline dl a{
	color:#0064E0;
}

#outline dl a:hover{
	color:#177FFF;
}


/*seminar
---------------------------------------------------------------------*/
#seminar {
    background-color: #e1effa;
}

#seminar .schedule {
	max-width: 1000px;
	margin: 0 auto;
	padding-left: 60px;
	box-sizing: border-box;
	display: flex;
    flex-direction: column;
    gap: 10px;
}

#seminar .interval {
	padding: 0.825rem 1.75rem;
    background-color: #a5dffb;
    color: #04377b;
    font-size: 1.125rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 1rem;
    border-radius: 50px;
}



#seminar .interval p {
    color: #04377b;
    font-size: 1.125rem;
    font-weight: 700;
}

#seminar .program {
	position: relative;
	margin-bottom: 6px;
}

#seminar .program time {
	width: 120px;
	height: 120px;
	background-color: #0d6fb8;
	color: #fff;
	font-size: 1.25rem;
    font-weight: 500;
    line-height: 1.125;
	border-radius: 50%;
	position: absolute;
	top: 0;
	left: -60px;
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	z-index: 1;
}

#seminar .program time span {
	transform: rotate(90deg);
	font-size: 0.85rem;
	font-weight: 300;
	margin-top: 2px;
}

#seminar .program .content {
	width: calc(100% - 6px);
	box-shadow: 6px 6px 0 #a5dffb;
	background-color: #fff;
}

#seminar .program .midashi {
	height: 120px;
	box-sizing: border-box;
	background-color: #c0ddf4;
	position: relative;
	display: flex;
    align-items: center;
	justify-content: space-between;
	padding-left: 80px;
    padding-right: 160px;
}

#seminar .program.no-detail .midashi {
	height: calc(120px - 6px);
}

#seminar .program .midashi .box {
	width: 200px;
}

#seminar .program .name {
	font-size: 1.125rem;
	font-weight: 700;
}

#seminar .program .title {
	color: #04377b;
	font-size: 1.375rem;
	font-weight: 700;
}

#seminar .program .sub_midashi {
	width: 120px;
	height: 40px;
	background-color: #e1effa;
	color: #0d6fb8;
	font-size: 1.25rem;
	font-weight: 700;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 14px;
	right: 14px;
}
#seminar .program [class^="speaker"]{
	padding: 1em;
	display: grid;
	grid-template-columns: repeat(2, auto);
	justify-content: center;
	align-items: center;
	gap: 1em;
	font-size: 0.875em;
}
#seminar .program [class^="speaker"] span{
	display: inline-block;
	font-size: 1.25em;
	font-weight: 700;
}
#seminar .program [class^="speaker"] li{
	display: grid;
	grid-template-columns: repeat(2, auto);
	align-items: center;
	gap: 1em;
}

#seminar .program .speaker02{
	gap: 2em;
}
#seminar .program .speaker03{
	grid-template-columns: repeat(3, auto);
	gap: 1.5em;
}
/*access
---------------------------------------------------------------------*/
#access {
    background-color:#a5dffb;
}

#access #access_inner{
    max-width: 1280px;
    margin: 80px auto 0;
	padding: 0 0 50px;
    display: flex;
    justify-content: space-around;
}

#access h3 {
	font-size: 1.5rem;
	font-weight: 500;
	padding:5px 10px 5px 20px;
	margin: 20px 0 0;
	position: relative;
}

#access h3::before {
    content: "";
    display: block;
    width: 8px;
    height: 33px;
    background-color: #ea5413;
    position: absolute;
    top: 6px;
    left: 0;
}

#access #access_info {
    width: 36%;
}
#access #access_info p {
	margin-top: 0.5rem;
}
#access #access_info span{
	font-size: 1.15em;
	font-weight: 700;
}

#access #access_info ul {
	margin-top: 0.5rem;
	padding-left: 30px;
}

#access #access_info ul li {
	position: relative;
	margin-bottom:1em;
}

#access #access_info ul li::before {
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 5px;
	background-color: #ea5413;
	position: absolute;
	top:0.5em;
	left: -1.2em;
}

#access #map {
    width: 48%;
}
#access #map iframe{
	max-width: 100%;
}
#access #map p{
	font-size: 0.75em;
	padding-left: 1.25em;
	text-indent: -1.25em;
}


/*apply
---------------------------------------------------------------------*/
#apply {
	background-color: #e1effa;
}


/*footer
---------------------------------------------------------------------*/
#footer{
	padding: 80px 30px 100px;
	box-sizing: border-box;
	background-color: #ededed;
	text-align: center;
}

#footer strong {
	font-size: 1.875rem;
	font-weight: 500;
}

#footer p {
	margin-top: 0.5rem;
	font-weight: 500;
}

#footer a {
	display: block;
	margin-top: 1rem;
}





/*topagetop
---------------------------------------------------------------------*/
#topagetop{
	position:fixed;
	right: 40px;
	bottom: 40px;
}

#topagetop a{
	display:block;
}

#topagetop a:hover{
	opacity:0.8;
}