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

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&family=Noto+Serif+JP:wght@400;500&family=Roboto:wght@300;700&display=swap');
#page-top {position: fixed;bottom: 40px;right: 40px;width: 60px; z-index:400;}
@media screen and (max-width: 896px) {
	#page-top {position: fixed;bottom: 5px;right: 5px;width: 30px; z-index:400;}
}

.EN {font-family: 'Roboto', sans-serif; font-weight: 300;}
.mincho {font-family: 'Noto Serif JP', serif;}

.bgWH {background-color: #FFF;}
.bgRD1 {background-color: #671E2C;}
.bgRD2 {background-color: #92394A;}
.bgPI {background-color: #FACDD6;}
.bgGRY {background-color: #EEEEEE;}
.txtWH {color: #FFF;}
.txtRD1 {color: #671E2C;}
.txtRD2 {color: #92394A;}
.txtGR {color: #84952B;}
.bBR {border-color: #BF9D63;}
.bDBL {border-color: #2F3B49;}

.clone-nav {position: fixed;top: 0;left: 0;z-index: 2; width: 100%; transition: .3s; transform: translateY(-100%);}
.is-show {transform: translateY(0);}
.clone-nav {text-align: center; width: 100%; background: #FFF;}

.ratioBox {position: relative;width: 100%;height: auto;}
.ratio1-1:before {content: "";display: block;padding-top: 100%; /* 1:1 */}
.ratio2-1:before {content: "";display: block;padding-top: 50%; /* 2:1 */}
.ratio3-2:before {content: "";display: block;padding-top: 66%; /* 3:2 */}
.ratio4-3:before {content: "";display: block;padding-top: 75%; /* 4:3 */}
.ratioInner {position: absolute;top: 0; left: 0;width: 100%;height: 100%;}

#subNavi {background: #671E2C; text-align: right; padding: 0 35px 0 0;}
#subNavi li {display: inline-block; letter-spacing: normal;}
#subNavi li a {display: block; padding: 10px 15px; line-height: 20px; color: #FFF;}
#subNavi li a span {width: 16px; margin-right: 5px;}
#subNavi li a span img{width: 20px; height: 20px;}
#subNavi li a:hover {background: #92394A; transition: .5s;}
#header {padding: 20px 35px 20px 50px; background: #92394A;}
.logo span.mark {width: 30px; margin-right: 15px; display: inline-block;}
.logo span.type {width: 285px; display: inline-block;}
#nav > a {display: none;}
#nav li {position: relative;}
#nav li a {display: block;}
#nav li a:active {background-color: #671E2C !important;}
#nav span:after {width: 10px; height: 10px; content: url("../img/cmn/icon_head6.svg"); position: absolute; right: -15px;}
/* first level */
#nav > ul {display: flex; flex-wrap: wrap;}
#nav > ul > li {display: inline-block; margin: 0 10px;}
#nav > ul > li:last-child {margin-right: 0;}
#nav > ul > li > a {font-size: 18px; padding: 5px 15px; color: #FFF;}
#nav > ul > li:hover > a, #nav > ul:not( :hover) > li.active > a {background-color: #671E2C;}
/* second level */
#nav li ul {background-color: #FFF; display: none; position: absolute; top: 100%; min-width: max-content; z-index: 2;}
#nav li:hover ul {display: block; left: 0; right: 0;}
#nav li:not( :first-child):hover ul {left: -1px;}
#nav li ul a {font-size: 16px; border-bottom: 5px solid #671E2C; padding: 8px 15px; color: #222;}
#nav li ul li a:hover, #nav li ul:not( :hover) li.active a {background-color: #EEE;}
#spnav {display: none;}
@media all and (-ms-high-contrast: none) {
  #nav li ul:first-child,#nav li ul:nth-child(2) {width: 240px;}
  #nav li ul:nth-child(3) {width: 432px;}
  #nav li ul:nth-child(4) {width: 174px;}
  #nav li ul:nth-child(5) {width: 190px;}
  #nav li ul:nth-child(6) {width: 139px;}
  #nav li ul:nth-child(7) {width: 110px;}

}
@media screen and (max-width: 1490px) {
  #subNavi {padding: 0 20px 0 0;}
  #subNavi li a {padding: 10px 10px;}
  #header {padding: 20px 20px 20px 20px;}
  #nav > ul > li {margin: 0 5px;}
  #nav > ul > li > a {padding: 5px 10px;}
  #nav span:after {width: 6px; height: 6px; right: -10px;}
}
@media screen and (max-width: 1290px) {
  #subNavi {padding: 0 15px 0 0;}
  #header {padding: 15px 15px;}
  .logo span.mark {width: 24px; margin-right: 10px;}
  .logo span.type {width: 245px; display: inline-block;}
  #nav > ul > li {margin: 0 5px;}
  #nav > ul > li > a {padding: 5px 10px;}
  #nav span:after {right: -6px;}
}
@media screen and (max-width: 1230px) {
  #nav > ul > li > a {font-size: 16px;}
  #nav li ul a {font-size: 14px; padding: 8px 10px;}
}
@media screen and (max-width: 1155px) {
  #nav > ul > li > a {font-size: 16px; padding: 5px 5px;}
  #nav span:after {right: -6px;}
}
@media screen and (max-width: 1075px) {
  #header {padding: 15px 15px 10px;}
  .logo {margin-bottom: 5px;}
  #nav {margin-left: auto;}
  #nav > ul > li {margin: 0 5px;}
  #nav > ul > li > a {padding: 5px 10px;}
}
@media only screen and (max-width: 1024px) /* 1000 */ {
  #nav {width: 100%; position: static; margin: 0;}
  #nav > ul {justify-content: flex-end;}
}
@media only screen and (max-width: 896px) /* 640 */ {
  #subNavi {display: none;}
  
  #nav {display: none;}
	#spnav {display: block;}
	#spnav button {background: #92394A; top: 5px; right: 10px; border-radius: 5px;}
	#spnav button:hover {background: #92394A;}
	.drawer-hamburger-icon,.drawer-hamburger-icon:before,.drawer-hamburger-icon:after {width: 100%; height: 3px; -webkit-transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000); transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000); background-color: #FFF;}
	.drawer-menu {background:#FFF;}
	.drawer-menu ul {padding:0; margin: 0; border-right: none;}
	.drawer-menu li {border-bottom:1px solid #666; line-height: 24px; width: 100%; text-align: left; display: block; border-left: none; width: auto;}
	.drawer-menu li:last-child {border-bottom: none;}
	.drawer-menu li a.drawer-menu-item {text-align: left; font-size: 14px; font-weight: 400; color: #222; padding: 10px 20px; border-bottom: none; border-left: none; text-decoration: none;}
	.drawer-menu li.spnav {display: block;}
	.drawer-dropdown-menu li {border-bottom:1px solid #999; line-height: 24px!important;}
	.drawer-dropdown-menu a {display: block; background-color: #EEE; text-decoration: none;}
	a.drawer-dropdown-menu-item {line-height: 24px!important; padding: 10px 30px;}
}
@media only screen and (max-width: 400px) {
  #header {padding: 15px 10px 10px;}
  .logo span.mark {width: 20px;}
  .logo span.type {width: 190px; display: inline-block;}
}

#side {width: 120px; position: fixed; top: 160px; z-index: 2;}
#side .btn li {width: 100%; height: 90px;display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
#side .btn li span {display: block; width: 20px; margin: 0 auto 5px;}
#side .btn li a {width: 100%; color: #92394A; display: block; text-align: center;}
#side .btn li:first-child {background: #EDA4AD;}
#side .btn li:last-child {background: #FACDD6;}
#side .sns li {width: 50%;}
#side .sns li a,#side .sns li img {width: 100%;}
/* 3カラムに直したいとき */
/* #side .sns li {width: 40px;}
// #side .sns li a,#side .sns li img {width: 100%;} */
/* 3カラムに直したいとき */

#btmCmn {background: #92394A;}
#btmCmn .bgWH {height: 50px;}
#btmCmn .ttl {font-size: 60px; line-height: 1;}
#btmCmn .box4 {border: 5px solid #92394A; position: relative;}
#btmCmn .txt {padding: 5px 20px; background-color: rgba(103,30,44,.8); background-image: url("../img/cmn/arrow_wh.svg"); background-repeat: no-repeat; background-size: 16px 16px; background-position: right 20px center; width: 100%; position: absolute; bottom: 10px; z-index: 1;}
#btmCmn li {display: flex; align-items: center; margin: 0 10px 20px; background: #FFF; border-radius: 10px;}
#btmCmn li a {display: block; padding: 8px 20px;}
#btmCmn li a span {display: inline-block; vertical-align: middle;}
#btmCmn li a span.pdf,#btmCmn li a span.edit,#btmCmn li a span.download {margin-right: 10px;}
#btmCmn li a span.pdf {width: 18px;}
#btmCmn li a span.edit {width: 27px;}
#btmCmn li a span.download {width: 24px;}
footer {padding: 50px 0 0;}
footer .logo {margin-right: auto; margin-left: auto;}
footer .icon14 {width: 14px; display: inline-block; margin-right: 5px;}
footer .sns li,footer .link li {display: inline-block; letter-spacing: normal;}
footer .sns li {width: 30px; margin-right: 20px;}
footer .link li {margin-right: 30px;}
footer .sns li:last-child,footer .link li:last-child,footer #fnavi .inner:last-child {margin-right: 0;}
footer #fnavi .inner {margin-right: 40px; min-width: max-content;}
#sitemap .inner {width: calc(33.333% - 40px); margin-left: 20px; margin-right: 20px;}
footer #fnavi ul > li a span,#sitemap ul > li a span {padding: 0 30px 10px 0; margin-bottom: 10px; background: url("../img/cmn/arrow_rd.svg") no-repeat right 7px top 3px; border-bottom: 1px solid #EDA4AD; position: relative; display: block;}
footer #fnavi ul > li a span:after,#sitemap ul > li a span:after {position: absolute; content: " "; display: block; border-bottom: 1px solid #92394A; bottom: -1px; right: 0; width: 30px;}
footer #fnavi ul > li > ul > li a,#sitemap ul > li > ul > li a {padding: 0 0 0 20px; margin-bottom: 5px; background: url("../img/cmn/fline.svg") no-repeat left center; display: block;}
footer #fnavi ul > li.arrow,#sitemap ul > li.arrow {display: block; background: url("../img/cmn/farrow.svg") no-repeat left center; padding: 0 0 0 20px; margin-bottom: 5px;}
.footCopy {text-align: center; background: #671E2C; padding: 20px 10px;}
.footCopy small {font-size: 14px; color: #FFF;}
#ftNavi {display: none;}
@media screen and (max-width: 1125px) {
  footer .mb20.mlr20 {width: calc(100% - 710px);}
}
@media screen and (max-width: 990px) {
  footer .mb20.mlr20,footer #fnavi {width: 100%;}
  footer #fnavi {justify-content: space-between;}
  footer #fnavi .inner {width: calc(33.333% - 20px); margin-right: 0;}
}
@media screen and (max-width: 896px) {
  #side .btn {display: none;}
  #side {width: 40px; top: 75px; right: 0;}
  #side .sns li {width: 40px;}
  #btmCmn .txt {padding: 5px 10px; background-position: right 10px center;}
  #btmCmn .flex.flexWrap.mb10 {justify-content: space-between; margin-left: 15px; margin-right: 15px;}
  #btmCmn .box4 {width: calc(50% - 7.5px); margin-left: 0; margin-right: 0;}
  #btmCmn li a {padding: 5px 10px;}
	footer {margin-bottom: 50px;}
	footer #navi li,footer #linkBtn li {margin: 0 10px 10px;}
	#ftNavi {display: block; background: #92394A; letter-spacing: -.4em; position: fixed; z-index: 5; bottom: 0; border-top: 1px solid #92394A; width: 100%;}
	#ftNavi ul {text-align: center; font-size: 10px; font-weight: bold;}
	#ftNavi li {letter-spacing: normal; display: inline-block; width: 25%;}
	#ftNavi li a {display: block; padding: 5px 0; color: #FFF; border-left: 1px solid #772e2f; border-right: 1px solid #a74535;}
	#ftNavi li:first-child a {border-left: none;}
	#ftNavi li:last-child a {border-right: none;}
	#ftNavi li span {width: 24px; margin: 0 auto 5px; display: block;}
}
@media screen and (max-width: 600px) {
  footer #fnavi ul > li > ul > li {display: none;}
  footer #fnavi .inner {width: 100%;}
}

.w1000 {width: 100%; max-width: 1000px; padding-left: 0; padding-right: 0;}
.w1500 {width: 100%; max-width: 1580px; padding-left: 0; padding-right: 0;}
.container {width: 100%; max-width: 1212px; padding-left: 0; padding-right: 0;}
.containers {width: 100%; max-width: 888px; padding-left: 0; padding-right: 0;}
.mlr,.container,.containers {margin-left: auto; margin-right: auto;}
.mlr5 {margin-left: 5px; margin-right: 5px;}
.mlr20,.col1,.col2,.col3,.col4,.col5,.col6,.box3,.w46,.w54 {margin-left: 20px; margin-right: 20px;}
.col1 {width: calc(16.6666% - 50px);}
.col2,.box3 {width: calc(33.3333% - 40px);}
.col3 {width: calc(50% - 40px);}
.col4 {width: calc(66.6666% - 40px);}
.col5 {width: calc(83.3333% - 40px);}
.col6 {width: calc(100% - 40px);}
.box4 {width: calc(25% - 30px); margin-left: 15px; margin-right: 15px;}
.btnBig {width: 100%;}
.btnMid {width: 80%;}
.btnMin {width: 100%; max-width: 220px;}
.w50 {width: 50%;}
.w46 {width: calc(46% - 50px);}
.w54 {width: calc(54% - 50px);}
@media screen and (max-width: 896px) {
  .containers {width: calc(100% - 30px);}
  .mlr20,.col1,.col2,.col3,.col4,.col5,.col6,.box3,.w46,.w54 {margin-left: 15px; margin-right: 15px;}
  .mlr5 {margin-left: 0; margin-right: 0;}
  .col1 {width: calc(16.6666% - 30px);}
  .col2,.box3 {width: calc(33.3333% - 30px);}
  .col3 {width: calc(50% - 30px);}
  .col4 {width: calc(66.6666% - 30px);}
  .col5 {width: calc(83.3333% - 30px);}
  .col6 {width: calc(100% - 30px);}
  .w46 {width: calc(46% - 30px);}
  .w54 {width: calc(54% - 30px);}
  .box4 {width: calc(50% - 30px);}
}
@media screen and (max-width: 568px) {
  .col1 {width: calc(33.3333% - 30px);}
  .col2,.col3,.col4,.col5,.col6,.box3,.w46,.w54 {width: calc(100% - 30px);}
}

ul.dot {list-style: disc; margin-left: 1.5em;}
ul.num {list-style: decimal; margin-left: 1.5em;}
ul.asterisk,ul.squa {margin-left: 1em;}
ul.asterisk li,ul.squa {list-style-type: none; text-indent: -1em;}
ul.asterisk li:before {display: inline; content: "※";}
ul.squa li:before {display: inline; content: "■";}

.tblw {min-width: 800px;}
table {width: 100%;}
table tr:nth-child(even) {background-color: #FFF;}
table tr:nth-child(odd) {background-color: #EEEEEE;}
table th,table td {padding: 8px 15px; font-weight: normal; line-height: 1.7; text-align: left; vertical-align: top}
table.result tr:first-child {background-color: #CCCCCC; text-align: center;}
table.result {border-top: 1px solid #666;}
table.result {border-top: 1px solid #666;}
table.result tr {border-bottom: 1px solid #666;}
table.result td {text-align: center; border-left: 1px solid #666; width: 70px;}
table .pd0 {padding: 0; border: none;}
table .pd0 table,table .pd0 table td,table .pd0 table th {border: none!important;}
table .w85 {width: 85px;}
table .w100 {width: 100px;}
table .w150 {width: 150px;}
table .w240 {width: 240px;}
table .w300 {width: 300px;}
table .w380 {width: 380px;}
table .w50-170 {width: calc(50% - 170px);}
table .bdrSld {border-bottom: 1px solid #222;}
table .bdrDot {border-bottom: 1px dotted #222;}
table.bgWH tr:nth-child(odd) {background-color: #FFF;}
table .bgGRY {background-color: #EEE!important;}
table .bgWH {background-color: #FFF!important;}
table .txtCent {text-align: center!important;}
table.tblRD {border: 1px solid #222222;}
table.tblRD2,table.tblRD3 {border: 1px solid #92394A;}
table.tblRD th,table.tblRD2 th,table.tblRD3 th {background: #92394A; color: #FFF; text-align: center;}
table.tblRD th,table.tblRD td,table.tblRD2 th,table.tblRD2 td,table.tblRD3 th,table.tblRD3 td {text-align: center; vertical-align: middle; border: 1px solid #222222;}
table.tblRD2 td {text-align: left;}
table.tblRD3 th,table.tblRD3 td {border: 1px solid #92394A;}
table.tblRD3 th {border-right: 1px solid #FFF;}
table.tblRD3 th:last-child {border-right: 1px solid #92394A;}
table.tblRD tr:nth-child(odd) {background-color: #FACDD6;}
@media screen and (max-width: 500px) {
}

.br20 {border-radius: 20px;}
.btr20 {border-top-left-radius: 20px; border-top-right-radius: 20px;}
.ttlL,.ttlC {background-image: url("../img/cmn/icon_ttl.svg"); background-size: 50px auto; background-repeat: no-repeat; margin-bottom: 30px;}
.ttlL {background-position: left center; padding: 0 0 0 60px; line-height: 50px;}
.ttlL span {margin-left: 10px; vertical-align: middle;}
.ttlC {background-position: center bottom; padding: 0 0 70px; text-align: center;}
.ttlC span {display: block; margin-top: 10px;}
.ttlBdrRD {border-bottom: 1px solid #671E2C; padding-bottom: 10px;}
.bdrtopRD {border-top: 1px solid #671E2C;}
.ttlSla {position: relative; display: inline-block; padding: 0 30px;}
.ttlSla:before,.ttlSla:after {content: ''; position: absolute; top: 50%; display: inline-block; width: 30px; height: 2px; background-color: #92394A;}
.ttlSla:before {-webkit-transform: rotate(60deg); transform: rotate(60deg);}
.ttlSla:after {-webkit-transform: rotate(-60deg); transform: rotate(-60deg);}
.ttlSla:before {left:0;}
.ttlSla:after {right: 0;}
.mkrPI {background: url("../img/cmn/mkr1.svg") repeat-x bottom; display: inline;}
.mkrRD {background: url("../img/cmn/mkr2.svg") repeat-x bottom; display: inline; text-shadow: 0 0 3px #FFF;}
.btn260 {max-width: 260px; width: 100%;}
.btn460 {max-width: 460px; width: 100%;}
.w500 {max-width: 500px; width: 90%;}
dl.w65 dt {width: 65px; float: left; clear: left; margin-bottom: 10px;}
dl.w65 dd {width: 100%; padding-left: 100px; margin-bottom: 10px;}
a .arrowLink {display: inline-block; background: url("../img/cmn/arrow_rd.svg") no-repeat right 10px center; padding-right: 36px;}
a:hover .arrowLink {background-position: right 0 center; transition: .5s;}
@media screen and (max-width: 896px) {
  .br20 {border-radius: 10px;}
}

#headImg {margin-top: 30px; position: relative;}
#headImg .inner {margin-left: 50px; border-top-left-radius: 20px; border-bottom-left-radius: 20px; background: #92394A;}
#headImg h2 {padding: 20px 50px; min-width: 340px; display: inline-block; position: absolute; z-index: 1; bottom: 100px; background: #92394A; color: #FFF;}
#headImg .kv {height: 450px; width: 100%;} 
#headImg .kv img {border-top-left-radius: 20px;}
#headImg .bread {padding: 15px 20px;}
#headImg .bread li {padding: 0 10px 0 16px; background: url("../img/cmn/icon_bread.svg") no-repeat left center; color: #FFF; display: inline-block;}
#headImg .bread li:first-child {padding: 0 10px 0 20px; background: url("../img/cmn/icon_head6.svg") no-repeat left center;}
#headImg .bread li:last-child {padding: 0 0 0 16px;}
#headImg .bread li a {display: block; color: #FFF;}

#mainVisual {background: -webkit-linear-gradient(bottom, #92394A 100px, #FFF 100px); background:-moz-linear-gradient(bottom, bottom, #92394A 100px, #FFF 100px); background:linear-gradient(to bottom, bottom, #92394A 100px, #FFF 100px); margin-top: 30px;}
.topmv {height: 68vh; width: calc(100% - 50px); margin-left: 50px; border-top-left-radius: 20px; border-bottom-left-radius: 20px;}
#topbtn {background: #92394A;}
#topbtn .ttl {font-size: 60px; margin-top: -55px; z-index: 1; position: relative;}
#topbtn .col3,#topbtn .col2 {text-shadow: 2px 2px 2px #000; position: relative;}
#topbtn .col3 .txt,#topbtn .col2 .txt {position: absolute; padding: 40px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%);}
#topbtn .col3 .arrow,#topbtn .col2 .arrow {padding: 0 36px 0 0; background: url("../img/cmn/arrow_wh.svg") no-repeat right center; display: inline-block; background-position: right 10px center;}
#topbtn .col3 a:hover .arrow,#topbtn .col2 a:hover .arrow {background-position: right 0 center; transition: .5s;}

.tab_area li,#catNav li {margin: 0 10px 20px; min-width: 104px; display: inline-block; letter-spacing: normal; border-radius: 20px; background-color: #EEE; font-size: 16px; position: relative;}
.tab_area li,#catNav li a {padding: 8px 20px;}
#catNav li a {display: block;}
.tab_area li:last-child,#catNav li:last-child {margin: 0 0 0 10px;}
.tab_area li.select,.tab_area li:hover,#catNav li a:hover,#catNav li.select a {background-color: #92394A; color: #FFF; border-radius: 20px;}
.tab_area li.select:after {content: url("../img/cmn/arrow_btm.svg");position: absolute; width: 12px; height: 8px; bottom: 4px; left: 0; right: 0; margin: auto;}
#catNav li.select:after {content: url("../img/cmn/arrow_btm.svg");position: absolute; width: 12px; height: 8px; bottom: 4px; left: 0; right: 0; margin: auto;}
.hide{display:none;}
.tabPanel {width: 100%; padding: 40px 0 0; display: none;}
.box5_10r5 {padding: 5px 10px; border-radius: 5px; display: inline-block;}
.box5_15r20 {padding: 5px 10px; border-radius: 20px; display: inline-block;}
.box5_25r5 {padding: 5px 25px; border-radius: 5px; display: inline-block;}
.box7_20r10abs {padding: 5px 25px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; display: inline-block; position: absolute; bottom: 0;}
.box15_20r10 {padding: 15px 20px; border-radius: 10px;}
.box8_10 {padding: 8px 10px;}
.box20rt10 {padding: 20px 20px 0; border-top-left-radius: 10px; border-bottom-right-radius: 10px;}
.mr10 {margin-right: 10px;}
.mr20 {margin-right: 20px;}
.mlrm20 {margin-left: -20px!important; margin-right: -20px!important;}
.post {padding: 0 0 50px; border-bottom: 1px solid #671E2C; margin-bottom: 20px;}
.post p {margin-bottom: 20px;}
.post p:last-child {margin-bottom: 0;}
.nextPost,.prevPost {background-repeat: no-repeat; background-size: 24px; line-height: 24px;}
.nextPost a,.prevPost a {color: #671E2C;}
.nextPost {background-image: url("../img/cmn/arrow_rd.svg"); background-position: right center; padding: 0 34px 0 0; text-decoration: underline;}
.prevPost {background-image: url("../img/cmn/arrow_rd2.svg"); background-position: left center; padding: 0 0 0 34px; text-decoration: underline;}
.newsDate {padding-bottom: 10px; border-bottom: 1px solid #92394A; display: inline-block; margin-top: 30px;}
.movieWrap {position: relative; width: 100%; padding-top: 56.25%;}
.movieWrap iframe {position: absolute; top: 0; right: 0; width: 100%; height: 100%;}

#top01 {background: url("../img/top/01-01.jpg") no-repeat center; background-size: cover; padding: 50px 0 30px;}
#top01 .mainImg {margin-top: -80px;}
#top02 .sideImg {width: 33%;}
#top02 .centTxt {width: 34%; background: #671E2C; padding: 75px 20px;}
#top03,#curriCourse {background: #92394A; padding: 40px 20px 0;}
#curriCourse {background: #FFF;}
#top03 .inner,#curriCourse .inner {max-width: 1920px; width: 100%; margin: 0 auto;}
#top03 .read {background: url("../img/top/03-01.jpg") no-repeat center; background-size: cover; padding: 50px 20px; border-radius: 20px; text-align: center;}
#top03 .col2,#curriCourse .col2 {background: #FFF; border-radius: 20px; padding-bottom: 30px; margin-bottom: 40px;}
#top03 .arrow img,#curriCourse .arrow img {width: 30px; position: absolute; bottom: 10px; right: 10px; z-index: 1;}
#top03 h4,#curriCourse h4 {position: relative; padding: 0 10px; text-align: center;}
#top03 h4:before,#curriCourse h4:before {position: absolute; top: calc(50% - 1px); left: 0; width: 100%; height: 2px; content: ''; background: #92394A;}
#top03 h4 span,#curriCourse h4 span {position: relative; padding: 0 10px; background: #fff; display: inline-block;}
#top03 h4 .spbr2,#curriCourse h4 .spbr2 {display: none;}
#curriCourse .col2,#curriCourse h4 span {background: #92394A;}
#curriCourse .col2 a {color: #FFF;}
#curriCourse h4:before {background: #FFF;}
#top04 .mlr20 {position: absolute; top: 0; right: 0;}
#top04 .movie {width: calc(28% - 30px); margin-left: 15px; margin-right: 15px;}
#top04 .movie:first-child {width: calc(44% - 30px);}
#top05 {background: url("../img/top/05-01.jpg") no-repeat center; background-size: cover; padding: 50px 0;}
#top05 .col2 {border-top-left-radius: 20px; position: relative;}
#top05 h4 {padding: 5px 20px; display: inline-block; border-top-left-radius: 20px; position: absolute; z-index: 1;}
#top05 .ratioInner img {border-top-left-radius: 20px;}
#top05 .txt {padding: 20px;}
@media screen and (max-width: 1530px) {
  #top03 h4,#curriCourse h4 {font-size: 1.8vw;}
  #top03 .txt18.mb10,#curriCourse .txt18.mb10 {padding: 0 15px;}
}
@media screen and (max-width: 1165px) {
  #top04 .txt {min-height: 56px!important; display: block;}
}
@media screen and (max-width: 1024px) {
  #headImg .kv {height: 25vh;} 
  .topmv {height: 50vh;}
  .tab_area li,#catNav li {margin: 0 5px 20px; text-align: center;}
  .tab_area li,#catNav li a {padding: 8px 10px;}
  #top04 .mlr20 {display: flex; flex-wrap: wrap; position: relative; width: calc(100% - 40px);}
  #top04 .btn260 {margin-left: auto;}
}
@media screen and (max-width: 896px) {
  .btr20 {border-top-left-radius: 10px; border-top-right-radius: 10px;}
  #headImg {margin-top: 20px;}
  #headImg .inner {margin-left: 15px; border-top-left-radius: 10px; border-bottom-left-radius: 10px;}
  #headImg h2 {padding: 10px 15px; min-width: 340px; bottom: 50px;}
  #headImg .kv {height: 23vh;} 
  #headImg .kv img {border-top-left-radius: 10px;}
  #headImg .bread {padding: 5px 10px; font-size: 12px;}
  #mainVisual {background: -webkit-linear-gradient(bottom, #92394A 100px, #FFF 100px); background:-moz-linear-gradient(bottom, bottom, #92394A 100px, #FFF 100px); background:linear-gradient(to bottom, bottom, #92394A 100px, #FFF 100px); margin-top: 20px;}
  .topmv {height: 40vh; width: calc(100% - 15px); margin-left: 15px;}
  #topbtn .ttl,#btmCmn .ttl {font-size: 40px; margin-top: -40px;}
  #btmCmn .ttl {margin-top: 0;}
  #btmCmn .bgWH {height: 30px;}
  #topbtn .col3 .txt {padding: 20px;}
  #topNews .mlr20.flex.spbt {flex-wrap: wrap;}
  .tab_area li,#catNav li {font-size: 14px;}
  .tabArea {width: 100%;}
  .box5_15r20,#top03 .read,#top03 .col2,#curriCourse .col2 {border-radius: 10px;}
  #top02 .sideImg {width: 100%; height: 20vh;}
  #top02 .centTxt {width: 100%; padding: 30px 15px;}
  #top03,#curriCourse {padding: 20px 0 0;}
  #top03 h4,#curriCourse h4 {font-size: 20px;}
  #top03 h4 span,#curriCourse h4 span {padding: 0;}
  #top03 .flex.flexWrap.txtCent {margin: 0 15px; justify-content: space-between;}
  #top03 .col2,#curriCourse .col2 {margin-bottom: 15px; width: calc(50% - 7.5px); margin-left: 0; margin-right: 0;}
  #top03 .box5_10r5 {margin-bottom: 10px;}
  #top03 .box5_10r5,#top03 .inlb.txt16 {margin-left: 10px;}
  #top03 .inlb.txt16 {margin-right: 10px;}
  #top04 .btn260.fr {margin-bottom: 30px;}
  #top04 .movie {width: calc(50% - 30px); margin-left: 15px; margin-right: 15px;}
  #top04 .movie:first-child {width: calc(100% - 30px);}
}
@media screen and (max-width: 568px) {
  .topmv {height: 32vh;}
  #top01 .mainImg {margin-top: -30px;}
  #top03 h4,#curriCourse h4 {font-size: 5vw;}
  #top03 h4 .spbr2,#curriCourse h4 .spbr2 {display: block;}
  #top04 .alEnd {align-items: flex-start;}
  #top05 {background: url("../img/top/05-02.jpg") no-repeat center; background-size: cover; padding: 50px 0;}
}

#indexNavi .col2,#indexNavi .col3 {position: relative;}
#indexNavi .txt {position: absolute; width: 100%; bottom: 20px; z-index: 1; padding: 10px 15px; background: rgba(255,255,255,.7) url("../img/cmn/arrow_rd.svg") no-repeat right 15px center; background-size: 20px;}
#indexNavi a:hover .txt {background-position: right 5px center; transition: .5s;}

.login-username {margin-bottom: 20px;}
.login-password {margin-bottom: 40px;}
.login-username label,.login-password label {display: inline-block; margin-right: 30px;}
.login-username input,.login-password input {display: inline-block; width: 350px!important;}
.login-submit {max-width: 260px; width: 90%; margin: 0 auto;}
.login-submit input[type="submit"] {background: #92394A; color: #FFF; text-align: center; font-size: 16px; font-weight: 700; width: 100%; line-height: 50px; border-radius: 25px;}

#curtPost .list {padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #EDA4AD;}
.ubdr.txtRD2 {color: #92394A!important;}
#course04 .mainImg {height: 450px; width: 100%;}
#voice .course {background: rgba(146,57,74,.8); margin: -40px 10px 0 calc(100% - 110px); height: 80px; text-align: center; color: #FFF; font-size: 12px; font-weight: 700; position: relative; z-index: 1;}
#voice .course .txt {position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%);}
#voice h4 {margin-top: -15px;}

#prostab1,#prostab2 {border-bottom: 1px solid  #EDA4AD; margin-bottom: 30px;}
#prostab1 li,#prostab2 li {border: 1px solid #EDA4AD; border-bottom: none;border-radius: 0; border-top-right-radius: 10px; background: #FFF; margin: 0 10px 0 0; color: #222; display: inline-block; letter-spacing: normal; font-size: 18px;}
#prostab1 li {padding: 10px 30px;}
#prostab2 li a {padding: 10px 30px; display: block;}
#prostab1 li.select,#prostab2 li.select a {background: #EDA4AD; color: #FFF; border-radius: 10px;}
#prostab1.tab_area li.select:after {content: '';}
#explanation #prostab2 {text-align: center; border-bottom: none;}
#explanation #prostab2 li {border-bottom: 1px solid #EDA4AD; border-radius: 10px; margin: 0 10px 10px 0;}
dl.bdrRD {border: 1px solid #92394A; border-bottom: none;} 
dl.bdrRD dt {padding: 8px 20px; width: calc(100% - 140px); float: left; clear: left;}
dl.bdrRD dd {padding: 8px 20px; width: 100%; border-bottom: 1px solid #92394A; text-align: right;}
dl.num dt {width: 40px; line-height: 40px; background: #92394A; border-radius: 20px; margin-right: 15px; margin-bottom: 15px; display: inline-block; letter-spacing: normal; vertical-align: middle; font-size: 30px; text-align: center; color: #FFF;}
dl.num dd {width: calc(100% - 55px); display: inline-block; letter-spacing: normal; vertical-align: middle; margin-bottom: 15px;}
.w30ImgR {width: 30%; float: right; margin: 0 0 0 40px;}
.w50Img5 {width: calc(50% - 5px);}
.mtm15 {margin-top: -15px;}
.w35 {width: calc(35% - 40px); margin-left: 20px; margin-right: 20px;}
.w65 {width: calc(65% - 40px); margin-left: 20px; margin-right: 20px;}
dl.w65 {width: 100%; margin-left: 0; margin-right: 0;}
dl.w65 dt {width: 65px;}
dl.w100 dt {width: 100px; float: left; clear: left; margin-bottom: 10px; padding-bottom: 10px;}
dl.w100 dd {width: 100%; padding-left: 100px; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #666;}
.w65m0 {width: 65%;}
.w35m0 {width: 35%;}
.hist dt {width: 115px; padding: 20px 0 0; float: left; clear: left; text-align: center;}
.hist dt span {display: block; line-height: 1;}
.hist dd {width: 100%; padding: 20px 0 20px 150px; border-bottom: 1px solid #FACDD6;}
.hist dd::after {content: ""; display: block; clear: left;}
.hist dd span.month {width: 40px; margin-right: 10px; display: inline-block; vertical-align: top; text-align: right;}
.hist dd span.txt {display: inline-block; vertical-align: top;}
.legal {border-top: 1px solid #666666;}
.legal dt {width: 200px; float: left; clear: left; padding: 10px 15px;}
.legal dd {width: 100%; padding: 10px 15px 10px 200px; border-bottom: 1px solid #666666;}
.howto {margin: 0 -20px;}
.howto .box {width: 33.333%; padding: 0 20px; border-right: 1px solid #671E2C;}
.howto .box:last-child {border-right: none;}
.howto .box img {width: 145px;}
#event .month {width: 100px; padding-top: 5px; text-align: center; border-top-right-radius: 10px; margin-top: -51px; margin-right: 20px; font-size: 80px; line-height: 1; z-index: 1; position: relative;}
#event .month span {display: block; font-size: 14px; padding-top: 5px;}
#event ul.squa {width: calc(100% - 120px); margin-top: 20px;}
#event li {display: inline-block; margin-left: 1em; letter-spacing: normal;}
.clubcat {position: relative; padding: 0 20px 0 0;}
.clubcat:before {position: absolute; top: calc(50% - 1px); left: 0; width: 100%; height: 2px; content: ''; background: #671E2C;}
.clubcat span {position: relative; padding: 0 1em 0 0; background: #fff;}
.clubName {width: calc(50% - 15px); border-bottom: 1px solid #FACDD6; padding-bottom: 10px; margin-bottom: 10px;}
.clubName.w100 {width: 100%;}
#read .mt20.mb20 .inlb.txt16.vtop.txtLeft {width: calc(100% - 90px);}
#curriTopic .mainImg {position: relative; z-index: 1;}
#curriTopic .abs {position: absolute; width: 100%; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%);}
#curriTopic .bgPI {padding: 35px 0 50px; margin-top: -17px;}
#teacher {margin-top: -70px; position: relative; z-index: 1;}
#teacher .w115 {width: 115px;}
#teacher .w120 {width: 120px;}
#teacher .w130 {width: 130px;}
#teacher .w145 {width: 145px;}
#teacher .w270 {width: 270px;}
.media {position: absolute; bottom: 60px;}
.media .ttlBdrRD {position: absolute; width: calc(33.333% - 20px); top: 28px;}
.media li {display: inline-block; vertical-align: bottom; margin-right: 10px; width: 154px;}
.media li:last-child {width: 124px; margin-right: 0;}
#exteach li {width: calc(20% - 40px); margin: 0 20px 20px;}
#exteach li span {display: block;}
.w275 {width: 275px;}
.sisSchool .abs {position: absolute; top: 0;}
.sisSchool .w175 {width: 175px; margin-left: 30px; margin-bottom: 20px;}
.sisSchool .w545 {width: 545px;}
.sisSchool .w1500 {padding-top: 80px;}
.sisSchool .ratioBox {margin-top: -23px; z-index: -1;}
.sisSchool .col2 .txt20 {font-weight: 700!important;}
.sisSchool .student {margin-left: -15px; margin-right: -15px;}
.sisSchool .student li {width: calc(33.333% - 30px); margin-left: 15px; margin-right: 15px; margin-bottom: 30px;}
#dlife .mainImg {width: 63.8%;}
#dlife .subImg {width: 32.7%;}
#dlife .col3 {position: relative;}
#dlife .arrow1,#dlife .arrow2,#dlife .arrow3,#dlife .arrow4 {position: absolute; top: 30px;}
#dlife .arrow1,#dlife .arrow3 {width: 214px; right: -30px;}
#dlife .arrow2,#dlife .arrow4 {width: 184px; right: 0;}
#dlife .arrow3 {right: auto; left: -30px;}
#dlife .arrow4 {right: auto; left: 0;}
@media screen and (max-width: 1150px) {
  #teacher {margin-top: 0;}
  #dlife .arrow1,#dlife .arrow2,#dlife .arrow3,#dlife .arrow4 {top: 0;}
  #dlife .arrow1,#dlife .arrow3 {width: 184px;}
  #dlife .arrow2,#dlife .arrow4 {width: 154px;}
  .sisSchool .abs {position: relative; top: 0;}
  .sisSchool .w1500 {padding-top: 0; margin-top: -100px;}
}
@media screen and (max-width: 1075px) {
  #curriTopic .mainImg {position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%);}
  #curriTopic .abs {position: relative; top: 0; transform: translateY(0); -webkit-transform: translateY(0);}
  #exteach li {width: calc(33.333% - 40px);}
}
@media screen and (max-width: 1000px) {
  #dlife .arrow1,#dlife .arrow2,#dlife .arrow3,#dlife .arrow4 {top: -20px;}
  #dlife .mainImg {width: 60%;}
  #dlife .subImg {width: 38%;}
}
@media screen and (max-width: 896px) {
  #prostab1 li,#prostab2 li {font-size: 14px;}
  #prostab1 li {padding: 8px 15px;}
  #prostab2 li a {padding: 8px 15px;}
  #read .col2,#read .col4 {width: calc(100% - 30px);}
  #curriTopic .mainImg {position: relative; top: 0; transform: translateY(0); -webkit-transform: translateY(0); margin-top: -30px; margin-bottom: 30px;}
  #curriTopic .col3 {width: calc(100% - 30px);}
  .txtCent .box5_15r20 {margin-left: 15px; margin-right: 15px;}
  .sisSchool .w545 {width: 80%;}
  .sisSchool .w1500 {padding-top: 0; margin-top: -50px;}
  dl.bdrRD dt {width: 100%; float: none;}
  dl.bdrRD dd {width: 100%;}
  dl.w100 dt {width: 100%; float: none; padding-bottom: 10px;}
  dl.w100 dd {width: 100%; padding-left: 0;}
}
@media screen and (max-width: 568px) {
  .w35 {width: calc(100% - 40px);}
  .w65 {width: calc(100% - 40px);}
  .w65m0 {width: 100%;}
  .w35m0 {width: 100%;}
  .hist dt {width: 115px; padding: 20px 0 0; text-align: center; float: none;}
  .hist dd {width: 100%; padding: 10px 0 20px 0;}
  #exteach li {width: calc(50% - 30px); margin: 0 15px 15px;}
}

/* モーダルCSS */
.modalOpen,.modalOpen2 {cursor: pointer;}
#modalContent {position: fixed; display: none; z-index: 5; border-radius: 10px; width: 90%; max-width: 1168px;}
#modalContent .inner {padding: 60px 20px 20px; max-height: 90vh; overflow: auto;}
#modalOverlay {z-index: 1; display: none; position: fixed; top: 0; left: 0; width: 100%; height: 120%;	background-color: rgba( 0,0,0, 0.75 );}
.button-link {width: 38px;}
.button-link:hover {cursor: pointer; color: #FFF;}
#modalClose {position: absolute; top: 20px; right: 20px;}
@media screen and (max-width: 896px) {
  #modalContent {width: 95%;}
  #modalContent .inner {padding: 40px 10px 10px; max-height: 90vh; overflow: auto;}
  #modalClose {top: 10px; right: 10px; width: 30px;}
}
