@charset "UTF-8";

/* ==========================================================================
   common
   ========================================================================== */

/* reset
   ========================================================================== */

html { height: 100%; font-size: 62.5%; margin: 0; padding: 0; border: none; outline: none; vertical-align: baseline; background: transparent; }
body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, hr,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, main, menu, nav, section, summary,
time, mark, audio, video { margin: 0; padding: 0; border: none; outline: none; vertical-align: baseline; background: transparent; }
body { height: 100%; color: #000; font-family: 'Noto Sans JP', sans-serif; font-size: 1.4rem; font-feature-settings: normal; line-height: 1; background-color: #fff; }
body, input, textarea, legend { color: #000; }
h1, h2, h3, h4, h5, h6 { font-weight: bold; }
input, select, textarea { padding: 0; margin: 0; }
article, aside, details, figcaption, figure, footer, header, main, menu, nav, section { display: block; }
nav ul { list-style: none; }
li { list-style-position: outside; }
ul li { list-style-type: none; }
blockquote, q { quotes: none; }
blockquote::before, blockquote::after,
q::before, q::after { content: ''; }
a { margin: 0; padding: 0; vertical-align: baseline; background: transparent; }
a, label { cursor: pointer; }
address, optgroup, cite { font-style: normal; }
abbr { border-bottom: .1em dotted; cursor: help; }
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
table { border-collapse: collapse; border-spacing: 0; width: 100%; }
th, td { text-align: left; vertical-align: top; border: 1px solid #000; }
caption { text-align: left; }
input, select { vertical-align: middle; }
em { font-style: normal; }
pre { overflow-x: auto; }
textarea { width: 99%; overflow: auto; }
iframe { display: block; width: 100%; overflow: hidden; }
sup { font-size: 1rem; vertical-align: baseline; position: relative; bottom: .7em; }
sub { font-size: 1rem; vertical-align: baseline; position: relative; top: .1em; }
img { vertical-align : middle; }
i { display: inline-block; margin-right: .2em; }



/* utilities
   ========================================================================== */

/* clearfix */
.wrapper::after { content: ''; display: block; clear: both; }

/* replace text */
.replace { display: block; color: rgba(0, 0, 0, 0); text-align: center; overflow: hidden; position: relative; }
a.replace:link, a.replace:visited, a.replace:hover, a.replace:active, a.replace:focus { color: rgba(0, 0, 0, 0); }
.replace::after { content: ''; display: block; width: 100%; height: 100%; background-repeat: no-repeat; background-color: transparent; background-position: center center; background-size: contain; position: absolute; left: 0; top: 0; z-index: 1; }



/* ==========================================================================
   parts
   ========================================================================== */

/* footer
   ========================================================================== */

footer { border-top: 2px solid #dc5310; padding: 75px 0; }

@media (min-width: 320px) and (max-width: 736px) {

footer p { font-size: 1.2rem; line-height: 1.2; }

}

@media (min-width: 737px) {

footer img { display: block; width: 122px; height: auto; margin: 0 auto; }
footer p { font-size: 1.6rem; font-weight: 400; line-height: 1; text-align: center; margin-top: 20px; }

}



/* header
   ========================================================================== */

header { width: 100%; height: 60px; background: linear-gradient(to right, #f08300, #dc5310); position: fixed; top: 0; z-index: 10; }
header.common a { text-decoration: none; }

@media (min-width: 320px) and (max-width: 736px) {

header.common { display: none; }

.hamburger { width: 50px; height: 50px; padding: 0; display: flex; justify-content: center; align-items: center; top: 5px; }
.hamburger__icon, .hamburger__icon:before, .hamburger__icon:after { display: block; width: 16px; height: 2px; background-color: #fff; }
.fat-nav li { font-size: 3.6rem; border-bottom: 1px solid #fff; }
.fat-nav li a { display: block; padding: 20px 0; }

}

@media (min-width: 737px) {

header.mobile,
.hamburger { display: none; }

header.common a.logo { width: 350px; height: 40px; }
header.common a.logo.replace::after { background-image: url(/media/logo_header.svg); }

/* nav */
header.common nav.main ul { display: flex; justify-content: space-around; align-items: center; max-width: 1366px; margin: 0 auto; box-sizing: border-box; }
header.common nav.main ul li a { display: flex; align-items: center; height: 60px; opacity: 1; transition: .25s; }
header.common nav.main ul li a:not(.logo):hover { opacity: .5; }
header.common nav.main ul li a:not(.logo) span { color: #fff; font-size: 1.6rem; font-weight: 400; line-height: 1; background: url(/media/arrow_down.svg) no-repeat right 80%; padding-right: 18px; }

}



/* general
   ========================================================================== */

main { margin-top: 60px; }

@media (min-width: 737px) {

header.common,
main,
footer { min-width: 1280px; }

}

video,
img { width: 100%; }

.billboard { margin-bottom: 100px; }

.section { font-feature-settings: 'palt' 1; margin-bottom: 180px; }
.section .inner { width: 1000px; padding-left: 180px; margin: 0 auto; }

.section .block { margin: 80px 0; }

.section h2 { color: transparent; font-size: 4.8rem; font-weight: 300; background: linear-gradient(to right, #dc5310 0%, #fff 50%); background-clip: text; text-fill-color: transparent; border-bottom: 2px solid #dc5310; padding-bottom: 10px; margin-bottom: 80px; }
.section h2 span { display: block; width: 1200px; margin: 0 auto; }
.section h3 { font-size: 4rem; font-weight: 900; margin-bottom: 15px; }
.section h4 { font-size: 3.2rem; font-weight: 700; margin-bottom: 10px; }

.section table th { width: 20%; text-align: right; }
.section table th,
.section table td { font-size: 3.2rem; font-weight: 300; line-height: 1.3; border: none; padding: 10px; }

.section p { font-size: 3.2rem; font-weight: 300; line-height: 1.6; margin-bottom: 60px; }
.section p.strong { font-size: 3.6rem; font-weight: 500; line-height: 1.4; }
.section p a { font-weight: 500; text-decoration: none; }
.section p a:hover { text-decoration: underline; }

.section ul li { font-size: 3.6rem; font-weight: 300; border-bottom: 1px solid #000; padding: 30px 0; }
.section ul li:last-child { border-bottom: none; }
.section ul li a { text-decoration: none; transition: .25s; }
.section ul li a:hover { color: #dc5310; }
.section ul li a .text > span,
.section ul li > span .text > span { display: block; }
.section ul li a .text > span:first-child,
.section ul li > span .text > span:first-child { margin-bottom: 15px; }
.section ul li .badge { display: inline-flex; width: 100px; height: 45px; color: transparent; font-size: 2.4rem; background: linear-gradient(to right, #e46a89, #fed4c6); background-clip: text; text-fill-color: transparent; border: 1px solid; }
.section ul li .heading { line-height: 1.3; }

@media (min-width: 320px) and (max-width: 736px) {
}

@media (min-width: 737px) {
}

/* link */
a, a img { border: none; }
a:link,
a:visited { color: #000; text-decoration: underline; }
a:hover,
a:active { text-decoration: none; }
a:focus { outline: none; }
a img { transition: opacity .25s ease 0s; }
a:hover img { opacity: .8; }

/* pagetop */
#pagetop { display: block; width: 50px; height: 50px; font-size: 0; background: url(/media/arrow_pagetop.svg) no-repeat #dc5310 center center; background-size: 30px 27px; position: fixed; right: 10px; bottom: 10px; opacity: .8; z-index: 9; }



/* news
   ========================================================================== */



