@charset "UTF-8";
@import url(../_fonts/fontawesome/css/all.min.css);

/* common ----------*/
body { margin-right: 320px; }
.pc {}
.sp { display: none !important; }
@media screen and (max-width: 1600px) {
	body { margin-right: 260px; }
}
@media screen and (max-width: 1300px) {
	body { margin-right: 0; }
}
@media screen and (max-width: 768px) {
	.pc { display: none !important; }
	.sp { display: block !important; }
}

/* navbar-header ----------*/
.navbar-header { height: auto; }
.navbar-brand { height: auto; padding: 20px 15px; }
.navbar-brand:hover {}
a.navbar-brand img { width: auto; }
a.navbar-brand img:hover { transform: none; }
@media screen and (max-width: 768px) {
	.navbar-brand { padding: 15px; }
	a.navbar-brand img { width: 200px; }
}

/* navbar ----------*/
#navbar {}
#navbar ul {}
#navbar ul li { padding: 0; border-top: solid 1px #FFF; text-indent: 0; transition: all 0.2s ease-out; }
#navbar ul li:hover { opacity: 0.6; }
#navbar ul li:nth-child(1), #navbar ul li:nth-child(2), #navbar ul li:last-child { border: none; }
#navbar ul li a { position: relative; padding: 5px 20px 5px 10px; color: #082048; font-size: 13px; font-weight: bold; }
#navbar ul li a:before { position: absolute; top: calc(50% - 6px); right: 10px; content: "\f105"; line-height: 1; font-size: 12px; font-family: 'Font Awesome 5 Pro'; font-weight: 400; }
#navbar ul li a i { display: none; }
#navbar ul li.en { padding-bottom: 10px; text-align: center; }
#navbar ul li.en a { display: inline-block; border: solid 1px rgba(255, 255, 255, 0.2); color: #FFF; line-height: 1; font-size: 12px; }
#navbar ul li.cat-01 { background-color: #082048; }
#navbar ul li.cat-01 a { color: #FFF; }
#navbar ul li.cat-02 { background-color: #DDDDDD; }
#navbar ul li.cat-03 { background-color: #FF8B8B; }
#navbar ul li.cat-04 { background-color: #FDAFAF; }
#navbar ul li.cat-05 { background-color: #FEC7C7; }
#navbar ul li.cat-06 { background-color: #FFD14F; }
#navbar ul li.cat-07 { background-color: #FFDB76; }
#navbar ul li.cat-08 { background-color: #FFE8A9; }
#navbar ul li.cat-09 { background-color: #A9E2A2; }
#navbar ul li.cat-10 { background-color: #B9EDB3; }
#navbar ul li.cat-11 { background-color: #CFF6CA; }

/* third_column ----------*/
#third_column { position: fixed; left: auto !important; right: 0 !important; width: 320px; height: 100vh; overflow-y: auto; overflow-x: hidden; padding: 20px; background-color: #EEEEEE; }
#third_column .banners { margin-bottom: 20px !important; margin: 0; padding: 0; list-style: none; }
#third_column .banners li { margin-bottom: 10px; }
#third_column .sns {}
@media screen and (max-width: 1600px) {
	#third_column { width: 260px; padding: 10px; }
	#third_column .banners li { margin-bottom: 5px; }
}
@media screen and (max-width: 1300px) {
	#third_column { position: inherit; left: auto !important; right: auto !important; display: flex; width: 100%; height: auto; overflow-y: inherit; overflow-x: inherit; padding: 20px; }
	#third_column .banners { width: 300px; margin-right: 20px; }
	#third_column .banners li { margin-bottom: 10px; }
	#third_column .sns { width: calc(100% - 300px - 20px); }
}
@media screen and (max-width: 768px) {
	#third_column { display: block; }
	#third_column .banners { width: 100%; margin-right: 0; }
	#third_column .banners li { width: 100%; margin-bottom: 10px; text-align: center; }
	#third_column .banners li a { display: block; width: 100%; }
	#third_column .banners li a img { display: inline-block; }
	#third_column .sns { width: 100%; }
}

/* #page-top ----------*/
#page-top { right: 340px; }
@media screen and (max-width: 1600px) {
	#page-top { right: 280px; }
}
@media screen and (max-width: 1300px) {
	#page-top { right: 20px; }
}

/* footer ----------*/
footer { height: auto; padding: 40px 15px 20px; background-color: #143A7B; }
footer .container { border: none; }
footer .logo { margin: 40px 0; text-align: center; }
footer .logo img { max-width: 330px; }
ul.footer-nav { text-align: center; }
ul.footer-nav a { color: #FFF; font-size: 16px; font-weight: normal; }
ul.footer-nav li:not(:first-child):before { margin-right: 2em; margin-left: 2em; }
@media screen and (max-width: 768px) {
	ul.footer-nav a { font-size: 14px; }
	ul.footer-nav li:not(:first-child):before { margin-right: 1em; margin-left: 1em; }
}

/* jumbotron ----------*/
.jumbotron { position: relative; height: 600px; margin-bottom: 0; padding: 0 60px; background-image: url(../_img/mv.jpg); }
.jumbotron-s { height: 300px; }
.jumbotron .title { right: 60px; margin-left: 60px; padding: 50px 80px; border-radius: 6rem !important; border-radius: 3px; color: #333 !important; background-color: rgba(162, 194, 248, 0.9) !important; }
.jumbotron-s .title { right: 20px; margin-left: 20px; padding: 20px 40px; }
.jumbotron h1 { font-size: 50px; }
.jumbotron-s h1 { font-size: 30px; }
.jumbotron h1 small { padding: 10px 20px; border-radius: 1rem; background-color: #333 !important; color: rgba(162, 194, 248, 1) !important; font-size: 24px; }
.jumbotron-s h1 small { padding: 5px 10px; font-size: 18px; }
.jumbotron p { padding: 20px 0; border-color: rgba(0, 0, 0, 0.5) !important; font-size: 22px; }
.jumbotron-s p { padding: 10px 0; font-size: 16px; }
@media screen and (max-width: 768px) {
	.jumbotron .title { right: 20px; width: calc(100% - 40px); height: auto; margin-left: 20px; padding: 20px; }
	.jumbotron h1 { font-size: 30px; }
	.jumbotron h1 small { padding: 5px 10px; font-size: 18px; }
	.jumbotron p { padding: 10px 0; font-size: 16px; }
}




/* --------------------------------------------------------------------------------------------

 index

-----------------------------------------------------------------------------------------------*/

/* .container ----------*/
.container { width: 100% !important; max-width: 1170px; }
.swiper-button-next, .swiper-button-prev { display: none; }
@media screen and (max-width: 768px) {
	.site-content .container { margin-left: 0; margin-right: 0; }
}

/* pickup ----------*/
.pickup { padding: 30px 0 0; background-color: #FFF; }
@media screen and (max-width: 768px) {
	.pickup { width: 100%; overflow: hidden; }
}

/* pickup_nav ----------*/
#pickup_nav { padding: 60px 15px; background-color: #FFF; }
#pickup_nav .pickup_nav_list { display: flex; flex-flow: wrap; max-width: 1240px; margin: auto; padding: 0; list-style: none; }
#pickup_nav .pickup_nav_list li { width: calc((100% - 40px) / 3); margin-right: 20px; }
#pickup_nav .pickup_nav_list li:nth-child(1) { margin-bottom: 20px; }
#pickup_nav .pickup_nav_list li:nth-child(3), #pickup_nav .pickup_nav_list li:nth-child(6) { margin-right: 0; }
#pickup_nav .pickup_nav_list li a { display: block; padding: 180px 20px 20px; border-radius: 3px; color: #FFF; background-repeat: no-repeat; background-position: center; background-size: cover; text-decoration: none; font-size: 24px; font-weight: bold; transition: all 0.2s ease-out; }
#pickup_nav .pickup_nav_list li a:hover { opacity: 0.6; }
#pickup_nav .pickup_nav_list li.a a { background-image: url(../_img/navi_01.jpg); }
#pickup_nav .pickup_nav_list li.b a { background-image: url(../_img/navi_02.jpg); }
#pickup_nav .pickup_nav_list li.c a { background-image: url(../_img/navi_03.jpg); }
#pickup_nav .pickup_nav_list li.d a { background-image: url(../_img/navi_04.jpg); }
#pickup_nav .pickup_nav_list li.e a { background-image: url(../_img/navi_05.jpg); }
#pickup_nav .pickup_nav_list li.f a { background-image: url(../_img/navi_06.jpg); }
#pickup_nav .pickup_nav_list li a span { position: relative; display: block; padding-bottom: 10px; border-bottom: solid 1px rgba(255, 255, 255, 0.5); }
#pickup_nav .pickup_nav_list li a span i { position: absolute; right: 0; }
@media screen and (max-width: 1500px) {
	#pickup_nav .pickup_nav_list li { width: calc((100% - 10px) / 2); margin-right: 10px !important; }
	#pickup_nav .pickup_nav_list li:nth-child(1), #pickup_nav .pickup_nav_list li:nth-child(3) { margin-bottom: 10px; }
	#pickup_nav .pickup_nav_list li:nth-child(2), #pickup_nav .pickup_nav_list li:nth-child(4), #pickup_nav .pickup_nav_list li:nth-child(6) { margin-right: 0 !important; }
	#pickup_nav .pickup_nav_list li a { display: block; padding: 120px 20px 20px; }
}
@media screen and (max-width: 768px) {
	#pickup_nav .pickup_nav_list li { width: 100%; margin-right: 0 !important; margin-bottom: 10px; }
	#pickup_nav .pickup_nav_list li a { display: block; padding: 100px 20px 20px; font-size: 18px; }
}

/* notice ----------*/
#notice { padding: 30px 15px; }
#notice .container { max-width: 1240px; margin: auto; padding: 30px 0; background-color: transparent; }
#notice .container .row .inner { padding: 40px; border-radius: 3px; background-color: #FFF; }
#notice h1 { display: block; margin-top: 0; padding: 10px 20px; border-radius: 3px; color: #FFF; background-color: #275BB3; text-align: center; font-size: 20px; font-weight: bold; }
#notice h1::before, #notice h1::after { display: none; }
#notice h2 { margin-bottom: 20px; padding: 10px; border-left: solid 4px #173C7A; color: #333; background-color: #f6f6f6; line-height: 1.4; font-size: 18px; font-weight: bold; }
#notice h2 span { color: #E00000; }
#notice .news {}
#notice .news h1 { background-color: #27B391; }
#notice .news dl { display: flex; flex-flow: wrap; margin-bottom: 0; padding-bottom: 0; }
#notice .news dl dt, #notice .news dl dd { margin-bottom: 10px; padding-bottom: 10px; border-bottom: solid 1px rgba(0, 0, 0, 0.05); }
#notice .news dl dt:nth-last-child(2), #notice .news dl dd:last-child { margin-bottom: 0; padding-bottom: 0; border: none; }
#notice .news dl dt { width: 8em; color: #275BB3; font-weight: bold; }
#notice .news dl dd { width: calc(100% - 8em); }
@media screen and (max-width: 768px) {
	#notice .container .row .inner { padding: 20px; }
}
