@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

:root {
  --main-color: #e63200; /* hsl(13 100% 45%) */
  --main-color-translucent: rgba(230,50,0,0.1);
  --main-color-dark: hsl(13 100% 30%);
  --sub-color-dark: #ff7732;
  --sub-color-light: #ffcca5;
  --sub-color-light-rgb: 255, 204, 165;

  --background-color: #fff;
  --background-color-light: #e0e1e2;
  --background-color-dark: #63696e;

  --text-color: #000;
  --text-color-light: #fff;
  --border-color: var(--background-color-dark);
}

/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
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, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}
/* ↑ HTML5 Doctor Reset CSS ↑ */

:root {
	/**
	 * circle_buttonの幅
	 * 幅を変更する場合、下記の変更が必要
	 * + <circle>の r属性（半径）の値：var(--btn-circle-width) * 0.9
	 *+ stroke-dasharray（線の長さ）4カ所: <circle r> * 2 * 3.14
	 */
	--btn-circle-width: 100px;
	--btn-circle-width-px: 100;

    /* グロナビをアニメさせるための、サブメニューの高さ */
    --max-height: 200px;
}

body {
    margin: 0;
    font-family: 'Noto Sans JP', sans-serif;
}

a {
    word-break: break-all;
}

/* -----------------------------
   Layout
 ---------------------------- */

.l-loading {
    width: 100vw;
    height: 100vh;
    transition: all 1s;
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9;
}

.l-loading.is-loaded,
.is-no-script .l-loading {
    opacity: 0;
    visibility: hidden;
}

/* ---- header ---- */
.l-header {
    background-color: #efefef;
    display: flex;
    justify-content: space-between;
    position: fixed;
    width: 100%;
    z-index: 10;
    background: rgba(255,255,255,0.8);
}

.l-header_logo {
    height: 60px;
    margin: 3px 0;
}

.l-header_nav a {
    text-decoration: none;
    color: var(--text-color);
}

@media screen and (max-width: 480px) {
    .l-header_logo svg {
        width: 130px;
    }

}


/* ---- globalnavi ---- */
.l-gnavi_lists {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    font-weight: bold;
}
.l-gnavi_list a {
    display: flex;
    font-size: 0.875rem;
    height: 66px;
    padding: 0 25px;
}
.l-gnavi_list--has_child a {
    padding: 0 5px;
}

.l-contact {
    /* background: linear-gradient(to bottom right, var(--main-color), var(--main-color-dark)); */
    background: linear-gradient(var(--main-color) 0%, var(--main-color-dark) 50%, var(--text-color) 51%, #000000 100%);
    background-size: 400% 400%;
    background-position: 0 0;
    margin-left: 30px;
    transition: all 0.3s;
}
.l-contact:hover {
    background-position: 100% 100%;
}
.l-contact a {
    display: flex;
    align-content: center;
    flex-wrap: wrap;
    color: #ffffff;
}

.l-nav_arrow {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 10px;
    height: 6px;
    margin-left: 10px;
    background: url(/-/media/BREXA-CrossBorder/img/common/arrow_nav.svg) no-repeat 0 0;
}

/*
.l-nav_arrow::after {
    content: "";
    position: absolute;
    top: 4px;
    left: 10px;
    width: 0;
    height: 0;
    border: 5px solid transparent;
    border-left: 5px solid var(--main-color);
    transform: rotate(90deg);
}
*/

@media screen and (max-width: 826px) {
    .l-gnavi_list a {
        padding: 23px 18px;
    }
}

@media screen and (max-width: 768px) {
    /*  hamburger-menu  */
    .menu-btn {
        right: 0px;
        display: flex;
        height: 59px;
        width: 65px;
        justify-content: center;
        z-index: 90;
    }
    #menu-btn-check:checked ~ .menu-btn {
        position: fixed;
        all: 1s;
    }
    #menu-btn-check:checked ~ .l-ham_menu_content {
        left: 0;
    }
    .menu-btn span {
        content: '';
        display: block;
        height: 1px;
        width: 30px;
        border-radius: 3px;
        background-color: var(--main-color);
        position: absolute;
        margin-top: 19px;
    }
    .menu-btn span:nth-of-type(2) {
        margin-top: 26px;
    }
    .menu-btn span:nth-of-type(3) {
        margin-top: 33px;
    }
    .menu-btn span:nth-of-type(4) {
        margin-top: 40px;
    }
    #menu-btn-check:checked ~ .menu-btn span:nth-of-type(1) {
        display: none;
        background-color: #ffffff;
        all: 1s;
    }
    #menu-btn-check:checked ~ .menu-btn span:nth-of-type(2) {
        transform: rotate(45deg);
        background-color: #ffffff;
        top: 4px;
        all: 1s;
    }
    #menu-btn-check:checked ~ .menu-btn span:nth-of-type(3) {
        transform: rotate(-45deg);
        background-color: #ffffff;
        top: -3px;
        all: 1s;
    }
    #menu-btn-check:checked ~ .menu-btn span:nth-of-type(4) {
        display: none;
        background-color: #ffffff;
        all: 1s;
    }
    #menu-btn-check {
    display: none;
    }
    .l-ham_menu_content {
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 100%;
        z-index: 80;
        background: rgba(30,30,30,0.9);
        transition: all 0.5s;
        /* opacity: 0.9; */
    }
    .l-ham_menu_content > ul {
        padding: 50px 20px 20px;
        color: #ffffff;
        margin-top: 0;
    }
    .l-ham_menu_content ul li {
        list-style: none;
        font-size: 0.875rem;
        position: relative;
    }
    .l-ham_menu_content ul li p {
        margin: 0;
    }
    .l-ham_menu_content ul li a,
    .l-ham_menu_content ul li p {
        display: block;
        width: 100%;
        font-size: 15px;
        box-sizing: border-box;
        color:#ffffff;
        text-decoration: none;
        padding: 9px 15px 10px 25px;
    }
    .l-ham_menu_content > ul > li::before {
        content: "";
        width: 7px;
        height: 7px;
        border-top: solid 2px var(--main-color);
        border-right: solid 2px var(--main-color);
        transform: rotate(45deg);
        position: absolute;
        top: 13px;
    }
    .l-ham_menu_content > ul > li > ul {
        padding-left: 40px;
    }
    .l-ham_menu_content > ul > li > ul > li {
        list-style: disc;
    }
    .l-ham_menu_content > ul > li > ul > li::marker {
        color: #595757;
    }
    .l-ham_menu_content > ul > li > ul > li a {
        padding: 9px 15px 10px 0;
    }

    .l-sp_nav_contact {
        margin: 0 20px 20px;
    }
    .l-sp_nav_contact a {
        text-decoration: none;
    }
    .l-sp_nav_contact a p {
        width: 100%;
        height: 66px;
        background: linear-gradient(to bottom right, var(--main-color), var(--main-color-dark));
        color: #ffffff;
        font-size: 0.875rem;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .l-sp_nav_docs ul {
        display: flex;
        padding: 0 20px;
        justify-content: space-between;
    }
    .l-sp_nav_docs ul li {
        width: 48%;
    }
    .l-sp_nav_docs ul li a {
        width: 100%;
        display: flex;
        background-color: var(--main-color);
        font-size: 0.875rem;
        justify-content: center;
        align-items: center;
        padding: 10px;
    }
    .l-sp_nav_docs ul li a svg {
        fill: currentColor;
        color: #ffffff;
        margin-right: 15px;
    }
    .l-sp_nav_policy {
        margin-top: 25px;
    }
    .l-sp_nav_policy ul {
        padding: 0 20px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }
    .l-sp_nav_policy ul li a {
        font-size: 0.75rem;
        padding: 0px 15px 0 15px;
        border-right: 1px solid #cccccc;
        line-height: 1;
    }
    .l-sp_nav_policy ul li:last-of-type a {
        border-right: none;
    }

}


/* ---- dropdown ---- */
.l-dropdown_lists {
    content: '';
    position: absolute;
    top: 66px;
    left: calc( 50% - 50vw );
    margin: 0 calc(50% - 50vw);
    display: block;
    width: 100vw;
    background: rgba(0,0,0,0.8);
    text-align: center;

    pointer-events: none;
    max-height: 0;

    transition: max-height 0.3s ease-out;
    overflow: hidden;
}

.l-gnavi_list:hover .l-dropdown_lists,
.l-gnavi_list.js-active .l-dropdown_lists {
    pointer-events: auto;
    max-height: var(--max-height);
}

.l-dropdown_lists li {
    margin: 0;
    padding: 0;
    display: inline-block;
}

.l-gnavi_list:hover .l-dropdown_lists li,
.l-gnavi_list.js-active .l-dropdown_lists li {
    animation: fadeIn 0.5s cubic-bezier(.76,-0.25,.86,.43);
}

.l-dropdown_lists a {
    display: block;
    padding: 10px 14px;
    height: auto;
    color: #fff;
    background: url(/-/media/BREXA-CrossBorder/img/common/dot_gray.gif) no-repeat left center;
    background-size: 1px 1em;
}

.l-dropdown_lists li:first-child a {
    background: none;
}

.l-gnavi_list a span:not(.l-nav_arrow),
.l-dropdown_lists a span {
    display: flex;
    align-items: center;
    border-bottom: solid 1px transparent;
    position: relative;
    overflow: hidden;
    min-height: calc(1.6em + 20px);
}

.l-gnavi_list a:hover span:not(.l-nav_arrow)::before,
.l-gnavi_list a:focus span:not(.l-nav_arrow)::before,
.l-gnavi_list .l-dropdown_lists a:hover span::before,
.l-gnavi_list .l-dropdown_lists a:focus span::before {
    content: '';
    display: inline-block;
    position: absolute;
    bottom: 10px;
    left: 0;
    height: 1px;
    width: 100%;
    background: var(--main-color);
    animation: slideIn 0.3s ease-out;
    z-index: 10;
}

.l-gnavi_list .l-dropdown_lists a:hover span::before,
.l-gnavi_list .l-dropdown_lists a:focus span::before {
    bottom: 0;
}

@keyframes slideIn {
    0% { left: -100% }
    100% { left: 0 }
}


/* ---- main ---- */
.l-main {
    padding-top: 0;
    line-height: 1.7;
}

.l-main_bg_img {
    background: url(/-/media/BREXA-CrossBorder/img/common/img_background.png) no-repeat;
    background-size: contain;
    background-position: 0 25%;
}

@media screen and (max-width: 480px) {
    .l-main_bg_img {
        background-position: 0 30%;
    }
}

:where(.l-main) a:link,
:where(.l-main) a:visited {
    color: revert;
    text-decoration: revert;
}

:where(.l-main) h1,
:where(.l-main) h2,
:where(.l-main) h3,
:where(.l-main) h4,
:where(.l-main) h5,
:where(.l-main) h6,
:where(.l-main) th,
:where(.l-main) li {
    font-weight: revert;
}

:where(.l-main) table tr th {
    text-align: center;
}

:where(.l-main) dt,
:where(.l-main) dd,
:where(.l-main) li,
:where(.l-main) th,
:where(.l-main) td,
:where(.l-main) p {
    line-height: revert;
    font-weight: revert;
}

:where(.l-main) ul,
:where(.l-main) li,
:where(.l-main) ol {
    list-style-type: revert;
}

:where(.l-main) img {
    display: revert;
}

/* ---- footer ---- */
.l-footer {
    background-color: var(--text-color);
    color: #ffffff;
    margin: -40px 0 -40px 0;
    padding-top: 95px;
}

.l-f_bc_items {
    display: flex;
    justify-content: space-between;
    padding-bottom: 40px;
    border-bottom: 1px solid #595757;
    margin-bottom: 40px;
}

.l-f_bc_item {
    width: 21%;
}

.l-f_bc_item > ul {
    list-style: none;
    padding: 0;
}

.l-f_bc_item a {
    text-decoration: none;
    color: #ffffff;
    transition: opacity 0.3s;
}

.l-f_bc_item a:hover {
    opacity: 0.4;
}

.l-f_bc_item > ul > li {
    font-size: 0.875rem;
    margin-bottom: 20px;
}
.l-f_bc_item > ul > li:last-of-type {
    margin-bottom: 0;
}

.l-f_bc_item > ul > li > ul {
    list-style: disc;
    padding-left: 30px;
}

.l-f_bc_item > ul > li > ul > li {
    font-size: 0.75rem;
    margin-bottom: 12px;
    color: #ffffff;
}

.l-f_bc_item > ul > li > ul > li::marker {
    color: #595757;
}

.l-f_bc_item > ul > li > ul > li:first-of-type {
    margin-top: 12px;
}
.l-f_bc_item > ul > li > ul > li:last-of-type {
    margin-bottom: 0;
}
.l-f_bc_item > ul > li::before {
    display: inline-block;
    content: "";
    width: 5px;
    height: 5px;
    border-top: 3px solid var(--main-color-dark);
    border-right: 3px solid var(--main-color-dark);
    transform: rotate(45deg);
    margin-right: 10px;
}
.l-f_policy_list > ul {
    list-style: disc;
    padding-left: 16px;
}
.l-f_policy_list > ul > li {
    font-size: 0.75rem;
}
.l-f_policy_list > ul > li::before {
    content: none;
}
.l-f_policy_list > ul > li::marker {
    color: #595757;
}
.l-f_com_info {
    display: flex;
    justify-content: space-between;
    margin-bottom: 38px;
}

.l-f_com_logo {
    display: flex;
}

.l-f_com_logo_link {
    width: 41%;
}

.l-f_com_logo .l-f_com_access p {
    font-size: 0.75rem;
    margin: 0 0 7px;
}
.l-f_com_logo .l-f_com_access .l-com_name {
    font-size: 0.875rem;
    margin: 0 0 13px;
}

.l-f_com_logo svg {
    margin-right: 75px;
}

.l-f_com_logo .l-f_com_access p:last-of-type {
    margin-bottom: 0;
}

.l-f_com_logo_link ul {
    list-style: none;
    display: flex;
    justify-content: flex-start;
    margin: 0;
}

.l-f_com_logo_link ul li {
    margin-right: 30px;
}
.l-f_com_logo_link ul li:last-of-type {
    margin-right: 0;
}

.l-f_copyright {
    text-align: center;
    padding-bottom: 20px;
    font-size: 0.75rem;
    color: #595757;
}

.l-f_copyright p {
    margin: 0;
}


.l-f_sns_btn {
    margin-top: 20px;
}

.l-logo_jpx {
    overflow: hidden;
    width: 217px;
    line-height: 1.3;
}

.l-logo_jpx a {
    color: #fff;
    font-size: 0.68rem;
    text-decoration: none;
}

.l-logo_jpx img {
    /* float: left; */
    margin-right: 10px;
}

.l-logo_jpx__text {
    display: block;
    overflow: hidden;
}

@media screen and (max-width: 1000px) {
    .l-f_com_info {
        justify-content: space-around;
        flex-wrap: wrap;
    }
    .l-f_com_logo {
        margin-bottom: 30px;
    }
    .l-f_com_logo_link {
        width: auto
    }

    .l-logo_jpx {
        padding-right: 0;
    }
}

@media screen and (max-width: 768px) {
    .l-f_com_info {
        padding: 0 10px;
    }

    .l-f_com_logo svg {
        margin-right: 20px;
        width: 230px;
    }
    .l-f_com_logo .l-f_com_access {
        /* margin-bottom: 35px; */
    }

}

@media screen and (max-width: 480px) {
    .l-footer {
        margin: -30px 0;
        padding-top: 67px;
    }

    .l-f_bc_items {
        display: block;
    }
    .l-f_bc_items .l-f_bc_item {
        margin: 0 auto;
        padding: 0;
    }

    .l-f_com_info {
        display: block;
    }
    .l-f_com_logo {
        display: block;
    }
    .l-f_com_logo_link ul {
        justify-content: space-around;
        padding-left: 0;
    }
    .l-f_com_logo svg {
        width: 115px;
        margin-right: 0;
        margin-bottom: 25px;
    }
    .l-f_com_logo_link ul li {
        margin-right: 10px;
    }
    .l-f_com_logo_link ul li:last-of-type {
        margin-right: 0;
    }
    .l-f_com_logo_link a img {
        width: 100%;
    }
    .l-f_com_logo_link a img.l-logo_sdgs,
    .l-f_com_logo_link a img.l-logo_jp-mirai {
        width: 85%;
    }

    .l-logo_jpx a img {
        width: auto;
    }

}

/* -------------------------------
   Component
 ------------------------------- */
.c-block_outer {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
}
.c-contents_box {
    max-width: 850px;
    width: 100%;
    margin: 0 auto;
}

@media screen and (max-width: 1060px) {
    .c-block_inner {
        padding: 0 20px;
    }
}

@media screen and (max-width: 480px) {
    .c-block_inner {
        padding: 0 10px;
    }

}

.c-contents_block {
    max-width: 1060px;
    width: 100%;
    margin: 0 auto;
    margin-bottom: 120px;
}

.c-contentx_box {
    max-width: 850px;
    margin: 0 auto;
}

.c-block_right {
    display: flex;
    flex-direction: row-reverse;
}

/* topicpath */
.c-topicpath_lists {
    list-style: none;
    display: flex;
    font-size: 0.75rem;
    flex-wrap: wrap;
}

.c-topicpath_list:after {
    content: '>';
    padding: 0 1em;
}
.c-topicpath_list:last-child:after {
    content: '';
  }

.c-topicpath_list a {
    text-decoration: none;
    color: var(--text-color);
}

.c-topicpath_list a:hover {
    text-decoration: underline;
}

/**
 * .c-circle_button
 * くるっ、とアニメする円形ボタン
 */
.c-circle_button {
    --btn-circle-width: 68px;
	--btn-circle-width-px: 68;

	display: inline-block;
	position: relative;
	text-decoration: none;
	width: var(--btn-circle-width);
	height: var(--btn-circle-width);
}

.c-circle_button__circle {
	transform: rotate(-90deg);
	width: 100%;
	height: 100%;
    position: absolute;
    left: 0%;
    top: 0;
    padding: 0;
    overflow: visible;
}

.c-circle_button circle {
	fill: transparent;
	stroke: var(--main-color);
	stroke-width: 1;
	stroke-dasharray: 0 201;
	/* firefox not supported ...
    r: calc( var(--btn-circle-width-px) * 0.9 / 2 );
    */
}

.c-circle_button:hover circle,
a:hover .c-circle_button circle {
	animation: circle 1s cubic-bezier(0.23, 1, 0.32, 1) 1 forwards;
}

@keyframes circle {
  0% { stroke-dasharray: 0 201; }
  99.9%,to { stroke-dasharray: 201 201; }
}

.c-circle_button::before {
	content: '';
	display: block;
	width: 90%;
	height: 90%;
	position: absolute;
	border-radius: 50%;

	--border-width: 1px;
	left: calc( 5% - var(--border-width) * 0.5 );
	top: calc( 5% - var(--border-width) * 0.5 );
	border: solid var(--border-width) var(--main-color);

	transform: scale(0.8);
	transition: all 1.5s cubic-bezier(0.23, 1, 0.32, 1);
}

.c-circle_button:hover::before,
a:hover .c-circle_button::before {
	transform: scale(1);
	opacity: 0;
}

.c-circle_button::after {
    content: '';
    display: inline-block;
    width: 100%;
    height: 100%;
    background: url(/-/media/BREXA-CrossBorder/img/common/arrow_right.svg) no-repeat center center;
}

@media screen and (max-width: 480px) {
    /* スマホでは、表示が変になるのでアニメさせない */
    .c-circle_button__circle {
        display: none;
    }
    .c-circle_button:hover::before,
    a:hover .c-circle_button::before {
        transform: scale(0.8);
        opacity: 1;
    }
}

/**
 * ページナビゲーション
 */
.c-pagenavi_items {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.c-pagenavi_to_index a,
.c-pagenavi_to_index a:link,
.c-pagenavi_to_index a:visited {
    padding: 13px 45px;
    text-decoration: none;
    border: var(--main-color) 1px solid;
    background-color: var(--main-color);
    color: #ffffff;
    margin: 0 25px;
    font-size: 0.875rem;
    transition: all 0.5s;
}

.c-pagenavi_to_index a:hover {
    background-color: #ffffff;
    color: var(--main-color);
    transition: all 0.5s;
}

.c-prev_btn {
    transform: rotate(180deg);
}

/**
 * ページネーション
 */
.c-pagenation_items {
    list-style: none;
    display: flex;
    justify-content: center;
}
.c-pagenation_items > li {
    margin-right: 15px;
}
.is-current {
    background-color: var(--main-color);
    border: var(--main-color) 1px solid;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.c-pagenation_item {
    width: 40px;
    height: 40px;
    text-align: center;
}

.c-pagenation_item > a {
    border: #595757 1px solid;
    background-color: #595757;
    display: block;
    color: #ffffff;
    text-decoration: none;
    line-height: 40px;
    transition: all 0.5s;
}

.c-pagenation_prev > a,
.c-pagenation_next > a{
    border: 1px solid var(--main-color);
    background-color: #ffffff;
    color: var(--main-color);
}

.c-pagenation_item > a:hover {
    background-color: var(--main-color);
    background-color: var(--main-color);
    border: var(--main-color) 1px solid;
    transition: all 0.5s;
}
.c-pagenation_item > a:hover svg,
.c-pagenation_item > a:hover img {
    color: #ffffff;
}
.c-pagenation_prev:hover,
.c-pagenation_next:hover {
    border: none;
}

@media screen and (max-width: 590px) {
    .c-pagenation_item {
        width: 27px;
        height: 27px;
    }
    .c-pagenation_item > a {
        line-height: 27px;
    }
    .c-pagenation_items > li {
        margin-right: 10px;
    }
    .c-pagenation_items > li svg {
        width: 15px;
        height: 8px;
    }
}


/**
 * 言語選択ボタン
 */
.c-lang_select_relative {
    position: relative;
}
.c-lang_select {
	position: absolute;
	right: 0;
	top: 0;
	font-size: 0.875rem;
	z-index: 1;
}

.c-lang_select__label {
    display: inline-block;
    background: url(/-/media/BREXA-CrossBorder/img/common/lang_select.svg) no-repeat 0 center;
    background-size: 23px 23px;
    padding-left: 30px;
    min-height: 22px;
    cursor: pointer;
}

.c-lang_select__label span {
	display: inline-block;
}

.c-lang_select.is-open .c-lang_select__label span {
	border-bottom: solid 1px var(--main-color);
}

.c-lang_select__menu {
	margin-top: 10px;
	/* display: none; */
	pointer-events: none;
	opacity: 0;
	transition: 0.5s;
	transform: translateY(-10px);
}

.c-lang_select.is-open .c-lang_select__menu {
	/* display: block; */
	pointer-events: auto;
	transform: translateY(0);
	opacity: 1;
}

.c-lang_select__menu a {
	display: block;
	background: var(--text-color);
	color: #fff;
	text-decoration: none;
	margin: 1px 0;
	padding: 10px 10px 10px 30px;
	transition: 0.3s;
}

.c-lang_select__menu a.is-active {
    background: var(--text-color) url(/-/media/BREXA-CrossBorder/img/common/checked.svg) no-repeat left 10px center;
}

.c-lang_select__menu a:hover {
	background-color: #595757;
}

.c-lang_select__label input {
	display: none;
}

.c-lang_select__label::after {
    content: url(/-/media/BREXA-CrossBorder/img/common/arrow_nav.svg);
    margin: 0 2px 0 5px;
    vertical-align: top;
}

@media screen and (max-width: 768px) {
	.c-lang_select {
		top: -40px;
	}
	.c-lang_select_relative {
		margin: 0 10px;
	}
}

@media screen and (max-width: 480px) {
	.c-lang_select {
		top: -50px;
	}
}


/**
 * 見出し・テキスト
 */
.c-tit_01 {
    font-family: "Montserrat", "Noto Sans JP",sans-serif;
    font-size: 2.25rem;
    text-align: center;
    font-weight: bold;
    margin-bottom: 40px;
    line-height: 1.6;
}
.c-tit_02 {
    font-family: "Noto Sans JP",sans-serif;
    font-size: 1.625rem;
    font-weight: bold;
    text-align: center;
}
.c-tit_03 {
    font-family: "Noto Sans JP",sans-serif;
    font-weight: bold;
    font-size: 1.5rem;
    line-height: 1.5;
}
.c-tit_04 {
    font-size: 1.5rem;
    line-height: 1.5;
    margin-bottom: 40px;
}
.c-tit_05 {
    font-size: 1.25rem;
    margin-bottom: 25px;
}
.c-tit_05_r {
	font-size: 1.25rem;
	color: var(--main-color);
	margin-bottom: 30px;
}
.c-tit_06 {
	background-color: var(--main-color);
	color: #fff;
	font-size: 1.5rem;
	padding: 10px 13px;
	display: inline-block;
	font-weight: 100;
}
.c-tit_07 {
	font-size: 1.125rem;
	line-height: 1.3;
	font-weight: bold;
}

/* 左に線を入れる */
.c-left_border_title {
	font-size: 1.25rem;
	font-weight: bold;
    padding-left: 16px;
    text-indent: -16px;
}

.c-left_border_title::before {
	content: '';
	display: inline-block;
	width: 6px;
	height: 1em;
	background: var(--main-color);
	margin-right: 10px;
	vertical-align: -3px;
}


.c-subTit {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.875rem;
    color: var(--main-color);
    display: block;
    margin-top: 10px;
    letter-spacing: 1px;
    font-weight: bold;
}
.c-subTit_02 {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.75rem;
    color: var(--main-color);
    display: block;
    margin-top: 10px;
    letter-spacing: 1px;
    font-weight: bold;
}

.c_sub_h1 {
    /* background: url(/-/media/BREXA-CrossBorder/img/common/img_bg_h1.png) no-repeat right; */
    height: 140px;
    background-color: #efefef;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 80px;
}

.c-h2_deco_01 {
    position: relative;
}
.c-h2_deco_01::before {
    content: "";
    display: block;
    width: 50px;
    border-bottom: 3px dotted var(--main-color);
    position: absolute;
    left: calc( 50% - 25px );
    bottom: -28px;
}
.c-txt_dec_02 {
    border-left: 5px solid var(--main-color);
    line-height: 1;
    padding-left: 10px;
}


.c-txt {
    font-size: 1rem;
    line-height: 1.7;
    margin-bottom: 15px;
}

.c-contents_txt {
    font-size: 1rem;
    line-height: 1.7;
    margin-bottom: 30px;
}
.c-contents_txt_02 {
    font-size: 1rem;
    margin-bottom: 15px;
}

.c-txt_red {
    color: var(--main-color);
}

.c-txt_white {
    color:#fff;
}

.c-txt_bold {
    font-weight: bold;
}

.c-txt_normal {
    font-weight: normal;
}

.c-small {
	font-size: 0.875rem;
	display: block;
}
.c-small_02 {
	font-size: 0.75rem;
}

sup {
	font-size: 0.5rem;
	vertical-align: super;
}

.c-txt_indent {
    text-indent: 1em;
}

.c-link_txt,
.c-link_txt:link,
.c-link_txt:visited {
    color: var(--text-color);
    text-decoration: underline;
}

.c-link_txt:hover {
    text-decoration: none;
    color: var(--main-color);
}

.c-link {
    position: relative;
    display: inline-block;
}
.c-link a {
    text-decoration: underline;
    color: var(--text-color);
    margin-left: 20px;
}

.c-link::before {
    display: inline-block;
    content: "";
    width: 6px;
    height: 6px;
    border-top: 2px solid var(--main-color);
    border-right: 2px solid var(--main-color);
    transform: rotate(45deg);
    margin-right: 10px;
    position: absolute;
    top: 11px;
}
.c-link:hover a {
    text-decoration: none;
    color: var(--main-color);
}



.c-num_lists_01 {
    padding: 20px 20px 20px 10px;
    font-size: 1rem;
    line-height: 1.7;
    counter-reset: li_count;
    margin-bottom: 30px;
}

.c-num_list_01 {
    list-style: none;
    margin-bottom: 5px;
    text-indent: -32px;
    padding-left: 32px;
}
.c-num_list_01::before {
    counter-increment: li_count;
    content: counter(li_count)".";
    margin-right: 20px;
}

.c-num_lists_03 {
    padding: 20px 20px 20px 10px;
    font-size: 1rem;
    line-height: 1.7;
    counter-reset: li_count;
    margin-bottom: 30px;
}

.c-num_list_03 {
    list-style: none;
    margin-bottom: 16px;
    text-indent: -45px;
    padding-left: 35px;
}
.c-num_list_03::before {
    counter-increment: li_count;
    content: counter(li_count);
    display: inline-block;
    box-sizing: border-box;
    width: 1.8em;
    margin-right: 20px;
    padding: 1px 0 3px;
    text-indent: 0;
    text-align: center;
	color: #fff;
	background-color: var(--main-color);
	font-weight: bold;
}
.c-num_list_03:last-of-type {
	margin-bottom: 0;
}


.c-txt_lists_01 {
    list-style: none;
    font-size: 1rem;
}
.c-txt_lists_01 li {
    text-indent: -1em;
    padding-left: 1em;
}
.c-txt_lists_01 li::before {
    content: "・";
    color: var(--text-color);
}

.c-txt_lists_02 {
    list-style: none;
    font-size: 1rem;
}
.c-txt_lists_02 li {
    text-indent: -1em;
    padding-left: 1em;
    margin-bottom: 15px;
}
.c-txt_lists_02 li::before {
    content: "・";
    color: var(--text-color);
}
.c-txt_lists_02 li:last-of-type {
    margin-bottom: 0;
}

.c-att_lists_01 {
    list-style: none;
    font-size: 0.875rem;
    font-weight: 100;
    color: #595757;
}
.c-att_lists_01 li {
    text-indent: -1em;
    padding-left: 1em;
}
.c-att_lists_01 li::before {
    content: "※";
}


.c-table {
    border-collapse:  collapse;
    margin: 0 auto;
    font-size: 1rem;
}

.c-table th,
.c-table td {
    border: 1px solid #cccccc;
    padding: 15px 20px;
}

.c-th {
    background-color: var(--text-color);
    color: #ffffff;
    text-align: left;
    vertical-align: middle;
    font-weight: 100;
}

.c-table_bg_gray {
	background-color: #efefef !important;
}

.c-bg_pink {
	padding: 20px 55px;
}

@media screen and (max-width: 480px) {
    .c-tit_01 {
        font-size: 1.5rem;
    }
}

/* 注釈 */
.c-notes,
.c-notes_list li {
	list-style: none;
	text-indent: -1.3em;
	padding-left: 1.3em;
	font-size: 0.875rem;
    font-weight: normal;
    color: #595757;
}

.c-notes--number,
.c-notes_list--number li {
	text-indent: -1.7em;
	padding-left: 1.7em;
}

/* チェックマーク付きのリスト */
.c-list--check,
.c-list--check ul {
    list-style: none;
    margin: 0;
    padding: 0;
    font-weight: bold;
    font-size: 1rem;
}

    .c-list--check li {
        margin: 0.3em 0;
        padding: 0 0 0 30px;
        background: url(/-/media/BREXA-CrossBorder/img/common/list_mark.svg) no-repeat left top 5px;
    }

/**
 * ピンク色のボックス
 */
.c-colored_box {
	margin: 0 auto 40px;
	border: solid 5px rgba(var(--sub-color-light-rgb),0.4);
}

.c-colored_box__title {
	background: rgba(var(--sub-color-light-rgb),0.4);
	margin: 0;
	padding: 15px 35px;
	font-size: 1.25rem;
}

.c-colored_box__title::before {
	content: '';
	display: inline-block;
	width: 5px;
	height: 1em;
	background: var(--main-color);
	margin-right: 10px;
	vertical-align: -3px;
}

.c-colored_box__body {
	padding: 10px 60px;
}

@media screen and (max-width: 480px) {
	.c-colored_box__title {
		padding: 10px 21px;
	}
	.c-colored_box__body {
		padding: 10px 15px;
	}
}


/**
 * ページ内ナビゲーション
 */
.c-in_page_nav {
    margin: 80px 0 100px;
}

.c-in_page_nav ul {
    max-width: 840px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

.c-in_page_nav li {
    width: 48%;
    border-bottom: solid 1px var(--main-color);
}

.c-in_page_nav a {
    display: block;
    padding: 10px 15px;
    text-decoration: none;
    font-weight: bold;
    font-size: 0.875rem;
    color: var(--text-color);
    position: relative;
    transition: 0.3s;
 }

    .c-in_page_nav a::after {
        content: '';
        display: inline-block;
        position: absolute;
        right: 10px;
        bottom: calc( 0.5em + 9px );
        width: 12px;
        height: 8px;
        background: url(/-/media/BREXA-CrossBorder/img/common/arrow_down.png) no-repeat 0 0;
        background-size: contain;
    }
 
 .c-in_page_nav a:hover::after {
     animation: inPageNavAnim 1.0s 1 forwards;
 }
 
 @keyframes inPageNavAnim {
     0% {
         transform: translateY(0);
         opacity: 1;
     }
     50% {
         transform: translateY(12px);
         opacity: 0;
     }
     60% {
         transform: translateY(-12px);
         opacity: 0;
     }
     100% {
         transform: translateY(0);
         opacity: 1;
     }
 }


/**
 * ページ中の「お問い合わせ」ボタン
 */
.c-contact {
    box-sizing: border-box;
    display: block;
    width: 100vw;
    margin: 120px calc( 50% - 50vw );
    padding: 40px 10px;
    min-height: 221px;
    /* background: #efefef url(/-/media/BREXA-CrossBorder/img/common/contact_bg.png) no-repeat top left; */
    background: #efefef;
    background-size: contain;
    text-align: center;
}

@media screen and (max-width: 500px) {
	.c-contact {
		background-size: cover;
	}
}

.c-contact__copy {
	margin: 0 0 1em;
	font-size: 1.25rem;
	font-weight: bold;
}

@media screen and (max-width: 480px) {
	.c-contact__copy {
			font-size: 1.0rem;
	}
}

.c-contact__button {
    display: inline-block;
    min-width: 590px;
    background: var(--main-color) url(/-/media/BREXA-CrossBorder/img/common/arrow_w.svg) no-repeat right 25px center;
    border: solid 2px var(--main-color);
    color: #fff;
    font-size: 1.125rem;
    text-decoration: none;
    padding: 25px 0;
    transition: 0.3s;
}

.c-contact__button:link,
.c-contact__button:visited {
    color: #fff;
}

    .c-contact__button:hover {
        background-color: #fff;
        background-image: url(/-/media/BREXA-CrossBorder/img/common/arrow.svg);
        color: var(--main-color);
    }

@media screen and (max-width: 600px) {
	.c-contact__button {
		width: 100%;
		min-width: 0;
	}
}


/**
 * topに戻るボタン
 */
.c-top_btn_block {
    margin-bottom: 30px;
}

.c-top_btn {
    font-size: 0.75rem;
    text-align: right;
}

.c-top_btn a {
    display: inline-block;
    color: var(--text-color);
    text-decoration: none;
}

.c-top_btn a span {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    font-weight: bold;
}

.c-top_btn a:hover svg {
    animation: top_btn_anim 1.0s 1 forwards;
}

@keyframes top_btn_anim {
	0% {
		transform: translateY(0);
        opacity: 1;
	}
	50% {
		transform: translateY(-20px);
		opacity: 0;
	}
    60% {
		transform: translateY(20px);
		opacity: 0;
	}
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

.c-top_btn a svg {
    color: var(--main-color);
    fill: currentColor;
    margin-bottom: 5px;
}


@keyframes fadeIn {
    0% { opacity: 0; }
    99.9%,to { opacity 1; }
}
.js-fadein {
    animation: fadeIn 3s cubic-bezier(0.23, 1, 0.32, 1) 1 both;
}

.contact_area {
    margin-bottom: 90px;
}

.contact_area.js-open {
    animation: contactOpen 1.5s cubic-bezier(0.23, 1, 0.32, 1) 1 both;
}
@keyframes contactOpen {
    0% { transform: translateY( 100px ) }
    100% { transform: translateY( 0 ) }
}

/**
 * contact
 */
.c-contact_items {
    display: flex;
    justify-content: space-between;
    list-style: none;
    padding: 0;
    margin: 0;
}

.c-contact_item {
    width: 49%;
}

.c-contact_link {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    background-color: var(--main-color);
    border: solid 2px var(--main-color);
    color: #ffffff;
    font-size: 1.25rem;
    text-decoration: none;
    width: 100%;
    height: 80px;
    justify-content: center;
    transition: all 0.3s;
}

.c-contact_link:link,
.c-contact_link:visited {
    color: #fff;
    text-decoration: none;
}

.c-contact_link:hover {
    background-color: #fff;
    color: var(--main-color);
}

.c-contact_link svg {
    fill: currentColor;
    margin-right: 25px;
}

@media screen and (max-width: 768px) {
    .contact_area {
        width: 100%;
    }

    .c-contact_link {
        width: 100%;
    }

    .c-top_btn {
        padding: 0 10px 0 0;
    }

}

@media screen and (max-width: 480px) {
    #contact_area_wrap {
        padding: 0 10px;
    }
    .c-contact_link {
        font-size: 0.875rem;
        width: 100%;
        height: 66px;
    }
    .c-contact_link > svg {
        height: 22px;
        width: 22px;
        margin-right: 18px;
    }

}

/* 追従ボタン */
.contact_area--fixed {
    position: fixed;
    right: 0;
    top: 130px;
    z-index: 10;
    width: auto;
}

.contact_area--fixed.js-open {
    animation: contactFixedOpen 1.5s cubic-bezier(0.23, 1, 0.32, 1) 1 both;
}
@keyframes contactFixedOpen {
    0% { transform: translateX( 100% ) }
    100% { transform: translateX( 0 ) }
}

.contact_area--fixed.js-close {
    animation: contactFixedClose 1.5s cubic-bezier(0.23, 1, 0.32, 1) 1 both;
}
@keyframes contactFixedClose {
    0% { transform: translateX( 0 ) }
    100% { transform: translateX( 100% ) }
}

.contact_area--fixed ul {
    display: block;
}

.contact_area--fixed ul li a,
.contact_area--fixed ul li a:link,
.contact_area--fixed ul li a:visited {
    display: flex;
    writing-mode: vertical-rl;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
    padding: 20px 15px;
    font-size: 0.875rem;
    width: 66px;
    height: auto;
    margin-bottom: 2px;
    line-height: 1.2;
    text-decoration: none;
}

.contact_area--fixed ul li a svg {
    width: 25px;
    height: auto;
    margin-right: 0;
    margin-bottom: 0.8em;
}

.c-contact_link__lf {
    display: none;
}

.contact_area--fixed .c-contact_link__lf {
    display: block;
}

.c-read_more {
    text-align: right;
}

.c-read_more a {
    text-decoration: none;
    color: var(--text-color);
    font-size: 0.875rem;
    display: inline-flex;
    align-content: center;
    align-items: center;
    font-weight: bold;
    letter-spacing: 1px;
}

.c-read_more .c-circle_button {
    margin-left: 10px;
}

@media screen and (max-width: 480px) {
    .c-read_more a span {
        margin-left: 20px;
        margin-right: -7px;
        height: 53px;
        width: 53px;
    }

    .c-read_more a span::after {
        background-size: 17px 10px;
    }

    .c-read_more a span svg {
        padding-top: 14px;
    }

}

/* スクロールで表示する */
.c-show_on_scroll {
    opacity: 0;
}

.is-no-script .c-show_on_scroll,
.c-show_on_scroll--animation {
    opacity: 1;
    animation: showOnScroll 1.0s ease-out both;
}

@keyframes showOnScroll {
	0% {
		opacity:0;
		transform: translate3d(0,30px,0);
	}
	100% {
		opacity:1;
		transform: translateZ(0);
	}
}


/* -----------------------------
   Utilities
 ---------------------------- */
/* margin padding */
.u-m_1l {
    margin-top: 1em !important;
    margin-bottom: 1em !important;
}
.u-mt_0 {margin-top: 0px !important;}
.u-mt_10 {margin-top: 10px !important;}
.u-mt_15 {margin-top: 15px !important;}
.u-mt_20 {margin-top: 20px !important;}
.u-mt_25 {margin-top: 25px !important;}
.u-mt_30 {margin-top: 30px !important;}
.u-mt_40 {margin-top: 40px !important;}
.u-mt_50 {margin-top: 50px !important;}
.u-mt_60 {margin-top: 60px !important;}
.u-mt_70 {margin-top: 70px !important;}

.u-mt_1l {margin-top: 1em !important; }

.u-mr_20 {margin-right: 20px !important;}

.u-mb_0 {margin-bottom: 0px !important;}
.u-mb_10 {margin-bottom: 10px !important;}
.u-mb_20 {margin-bottom: 20px !important;}
.u-mb_25 {margin-bottom: 25px !important;}
.u-mb_30 {margin-bottom: 30px !important;}
.u-mb_40 {margin-bottom: 40px !important;}
.u-mb_50 {margin-bottom: 50px !important;}
.u-mb_60 {margin-bottom: 60px !important;}
.u-mb_70 {margin-bottom: 70px !important;}
.u-mb_80 {margin-bottom: 80px !important;}
.u-mb_100 {margin-bottom: 100px !important;}
.u-mb_120 {margin-bottom: 120px !important;}

.u-mb_1l {margin-bottom: 1em !important;}

.u-mr_5 {margin-right: 5px !important;}
.u-mr_10 {margin-right: 10px !important;}
.u-mr_15 {margin-right: 15px !important;}
.u-mr_20 {margin-right: 20px !important;}
.u-mr_25 {margin-right: 25px !important;}
.u-mr_30 {margin-right: 30px !important;}
.u-mr_35 {margin-right: 35px !important;}
.u-mr_40 {margin-right: 40px !important;}
.u-mr_45 {margin-right: 45px !important;}
.u-mr_50 {margin-right: 50px !important;}

.u-ml_5 {margin-left: 5px !important;}
.u-ml_10 {margin-left: 10px !important;}
.u-ml_15 {margin-left: 15px !important;}
.u-ml_20 {margin-left: 20px !important;}
.u-ml_25 {margin-left: 25px !important;}
.u-ml_30 {margin-left: 30px !important;}
.u-ml_35 {margin-left: 35px !important;}
.u-ml_40 {margin-left: 40px !important;}
.u-ml_45 {margin-left: 45px !important;}
.u-ml_50 {margin-left: 50px !important;}

.u-pt_60 {padding-top:60px !important;}
.u-pt_70 {padding-top:70px !important;}

.u-pr_10 {padding-right: 10px !important;}
.u-pr_15 {padding-right: 15px !important;}
.u-pr_20 {padding-right: 20px !important;}
.u-pr_25 {padding-right: 25px !important;}
.u-pr_30 {padding-right: 30px !important;}
.u-pr_35 {padding-right: 35px !important;}
.u-pr_40 {padding-right: 40px !important;}
.u-pr_45 {padding-right: 45px !important;}
.u-pr_50 {padding-right: 50px !important;}

.u-pl_10 {padding-left: 10px !important;}
.u-pl_15 {padding-left: 15px !important;}
.u-pl_20 {padding-left: 20px !important;}
.u-pl_25 {padding-left: 25px !important;}
.u-pl_30 {padding-left: 30px !important;}
.u-pl_35 {padding-left: 35px !important;}
.u-pl_40 {padding-left: 40px !important;}
.u-pl_45 {padding-left: 45px !important;}
.u-pl_50 {padding-left: 50px !important;}

.u-pb_60 {padding-bottom: 60px;}


@media screen and (max-width:480px) {
    .u-sp_pr_30 {padding-right: 30px !important;}
}

.u-mb_border {border-bottom: 1px solid #cccccc;}

/*  2022/08/02追加 ここから */
.u-ex_link::after {
    content: "";
    background: url(/-/media/BREXA-CrossBorder/img/common/icon_blank.png);
    width: 10px;
    height: 10px;
    display: inline-block;
    margin-left: 5px;
    background-repeat: no-repeat;
}
.u-ex_link_right {
    position: relative;
}
.u-ex_link_right::after {
    content: "";
    background: url(/-/media/BREXA-CrossBorder/img/common/icon_blank.png);
    width: 10px;
    height: 10px;
    display: inline-block;
    right: 8px;
    bottom: 8px;
    position: absolute;
}
/*  2022/08/02追加 ここまで */

/* text-align */
.u-ta_center {
    text-align: center !important;
}
.u-ta_left {
    text-align: left !important;
}
.u-ta_right {
    text-align: right !important;
}

/* テキストの途中で折り返さないようにする */
.u-no_wrap_text {
    display: inline-block !important;
}

/* 寄せをclear */
.u-clear {
    clear: both;
}

.u-clearfix::after {
    content: '';
    display: block;
    clear: both;
}
/* font-size */
.u-fs_125r {font-size: 1.25rem !important;}
.u-fs_135r {font-size: 1.35rem !important;}
.u-fs_170r {font-size: 1.7rem !important;}
.u-fs_190r {font-size: 1.9rem !important;}

/* font color */
.c-fc_gray {color: #595757 !important;}

/* PC TAB SP 表示  */
.u-only_pc {
    display: block !important;
}
.u-only_pc_tab {
    display: block !important;
}
.u-only_tab {
    display: none !important;
}
.u-only_sp {
    display: none !important;
}

@media screen and (max-width:768px) {
    .u-only_pc {
        display: none !important;
    }
    .u-only_tab {
        display: block !important;
    }
}

@media screen and (max-width:480px) {
    .u-only_pc_tab {
        display: none !important;
    }
    .u-only_sp {
        display: block !important;
    }
}


/* 2025/07 追加 */
#header__area {
    box-sizing: border-box;
}

.footer.gray .footer__top-navi--item ul li a {
    font-size: 0.875rem;
}

.footer.gray .footer__top-navi--item--sub ul li a {
    font-size: 0.875rem;
}