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

div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, a, blockquote, th, td, figure {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
    word-wrap: break-word;
    margin: 0;
    padding: 0;
}
th, td {
    word-break: break-all;
}
img {
    border: 0;
    vertical-align: bottom;
}
ul, ol {
    list-style: none;
    margin: 0;
    padding: 0;
}
table {
    border-collapse: collapse;
}
body {
    font-family: 'Noto Sans JP', 'ヒラギノ角ゴシック', 'メイリオ', sans-serif;
    color: #000;
    line-height: 1.7;
    font-size: 14px;
    word-wrap: break-word;
    margin: 0;
    padding: 0;
}

@media screen and (max-width: 768px) {
body {
    font-size: 15px;
}
}
 @keyframes show {
 from {
 opacity: 0;
}
 to {
 opacity: 1;
}
}
.cf:after {
    content: ".";
    display: block;
    height: 0;
    font-size: 0;
    clear: both;
    visibility: hidden;
}
.cf {
    zoom: 1; /* old IE6or7  */
}
h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
    line-height: 1.3;
}
p {
    line-height: 2;
}
p.text--center {
    text-align: center;
}
a {
    color: #000;
    text-decoration: none;
}
a:hover {
    color: #20396e;
}
.ttleffect {
    position: relative;
    transition: 1s ease-out;
}
.imgeffect_off {
}
.imgeffect_on {
}
.btn {
    font-size: 18px;
    font-weight: 500;
    text-align: center;
    line-height: 1.3;
    background: #c8ebeb;
    background-image: url(../images/btn_back.png);
    background-repeat: no-repeat;
    background-position: 100% 50%;
    padding: 20px;
    display: block;
    transition: all 300ms ease;
}
.btn:hover {
    color: #000;
    opacity: 0.6;
}
.btn.btn--contact {
    color: #fff;
    text-align: left;
    background: #000;
    background-image: url(../images/btn_back_w.png);
    background-repeat: no-repeat;
    background-position: 100% 50%;
}
.btn.btn--outbound {
    width: 760px;
    margin: 0 auto;
}
.btn.btn--pdf {
    height: 80px;
    width: 760px;
    text-align: left;
    margin: 0 auto;
    padding: 0;
    position: relative;
    display: flex;
    align-items: center;
}
.btn.btn--pdf img {
    position: absolute;
    top: 0;
    left: 0;
}
.btn.btn--pdf span {
    display: block;
    padding: 0 20px 0 130px;
}

@media screen and (max-width: 768px) {
.btn {
    width: 100%;
    line-height: 1.3;
    margin: 0 auto;
    padding: 20px;
}
.btn.btn--outbound {
    width: 100%;
}
.btn.btn--pdf {
    width: 100%;
}
.btn.btn--pdf span {
    padding: 0 20px 0 95px;
}
}
.imgbox {
    display: flex;
    justify-content: center;
    align-items: center;
}
.imgbox img {
    height: auto;
    width: auto;
    max-height: 100%;
    max-width: 100px;
}
.img--show {
    display: block;
}
.img--hover {
    display: none;
}
.rowgroup {
    margin: 0 10px;
    display: flex;
    justify-content: space-between;
    position: relative;
}
.row__item {
    position: relative;
    align-items: stretch;
}
.row__title {
    font-size: 22px;
    font-weight: 500;
    text-align: center;
    margin-bottom: 20px;
}
.row__title.row__title--stc {
    position: static;
}
.row__title--sub {
    font-size: 20px;
    font-weight: 500;
    text-align: center;
    margin-bottom: 20px;
}
.row__text {
    margin-bottom: 30px;
}
.row__item img {
    max-width: 100%;
    margin-bottom: 20px;
}
.row__item .btn {
    width: 100%;
    position: absolute;
    bottom: 0;
}
.row2 {
}
.row2 .row__item {
    width: 450px;
}
.row3 {
}
.row3 .row__item {
    width: 280px;
}

@media screen and (max-width: 768px) {
.rowgroup {
    width: 100%;
    margin: 0 auto;
    display: block;
}
.row__item:last-child {
    margin-bottom: 0;
}
.row__title {
    font-size: 28px;
}
.row__title--sub {
    font-size: 17px;
}
.row__title--sub br {
    display: none;
}
.row__item img {
    height: auto;
    width: 100%;
}
.row3 .row__item {
    width: 100%;
    margin-bottom: 80px;
}
.row2 .row__item, .row3 .row__item {
    width: 100%;
    margin-bottom: 80px;
}
}
/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/

/* Header */

/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/
.wrap {
    position: relative;
}
/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/

/* Header */

/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/
#header__wrapper {
    width: 100%;
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 4;
}
.header__inner {
    height: 80px;
    width: 960px;
    margin: 0 auto;
    position: relative;
    display: flex;
}
.header__logo {
    transition: 0.5s ease-out;
}
.header__logo img {
    margin: 27px 0 0 10px;
}

@media screen and (max-width: 768px) {
.header__inner {
    width: 100%;
    display: block;
}
}
/*--------------------------------------------------------------*/
/* globalnavi */
/*--------------------------------------------------------------*/
#globalnavi__list {
    height: 48px;
    width: 800px;
    font-weight: 500;
    text-align: right;
    margin: 20px 0 0 0;
}
.globalnavi__litem {
    margin: 0 21px;
    font-weight: 500;
    line-height: 1.6;
    display: inline-block;
    vertical-align: top;
    border-bottom: 1px solid;
    border-bottom-color: rgba(0,0,0,0);
}
.globalnavi__litem a {
    height: 48px;
    text-align: center;
    padding: 0 3px;
    display: flex;
    align-items: center;
}
.globalnavi__litem:hover, .globalnavi__litem.active:hover {
    color: #20396e;
    border-bottom: 1px solid #20396e;
    transition: 0.5s ease-out;
}
.globalnavi__litem.active {
    border-bottom: 1px solid #646464;
}

@media screen and (min-width: 769px) {
.switch--second {
    position: relative;
    cursor: pointer;
}
.switch--second span {
    height: 48px;
    text-align: center;
    background-image: url(../images/second.png);
    background-repeat: no-repeat;
    background-position: 50% 100%;
    padding: 0 3px;
    display: flex;
    align-items: center;
}
.list-second__wrapper {
    padding-top: 40px;
    display: none;
    position: absolute;
    top: 48px;
    left: -105px;
}
.globalnavi__list-second {
    width: 260px;
    background: rgba(0, 0, 0, 0.7);
    padding: 10px 0;
}
.globalnavi__list-second::before {
    content: "";
    height: 21px;
    width: 25px;
    background-image: url("../images/globalnavi_arrow.png");
    background-repeat: no-repeat;
    opacity: 0.7;
    position: absolute;
    top: 22px;
    left: 0;
    right: 0;
    margin: auto;
}
.globalnavi__list-second .globalnavi__litem {
    border: 1px solid;
    border-color: rgba(0, 0, 0, 0);
    margin: 4px 10px;
    display: block;
}
.globalnavi__list-second .globalnavi__litem a {
    height: auto;
    color: #fff;
    line-height: 1;
    text-align: left;
    padding: 5px 0px 5px 0px;
    display: block;
}
.globalnavi__list-second .globalnavi__litem:hover {
    border-color: #969696;
}
.globalnavi__litem.switch--second:hover {
    border: none;
}
.switch--second:hover .list-second__wrapper, .globalnavi__list-second:hover {
    display: block;
}
}
#Menu {
    display: none;
}

@media screen and (max-width: 768px) {
#Menu {
    width: 52px;
    height: 52px;
    position: absolute;
    top: 10px;
    right: 16px;
    pointer-events: none;
    display: block;
}
#Menubtn {
    width: 52px;
    height: 52px;
    cursor: pointer;
    border-radius: 26px;
    position: relative;
    margin: 0 auto;
    pointer-events: auto;
}
#Menubtn span {
    display: block;
    width: 25px;
    height: 1px;
    background: #646464;
    position: absolute;
    transition: all 0.4s;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    left: 21px;
}
#Menubtn span:first-child {
    top: 15px;
}
#Menubtn span:nth-child(2) {
    top: 50%;
}
#Menubtn span:last-child {
    bottom: 15px;
}
#Menubtn.active span:first-child {
    -webkit-transform: translateY(12px) rotate(45deg);
    -moz-transform: translateY(12px) rotate(45deg);
    -ms-transform: translateY(12px) rotate(45deg);
    transform: translateY(12px) rotate(45deg);
}
#Menubtn.active span:nth-child(2) {
    opacity: 0;
}
#Menubtn.active span:last-child {
    background: #646464;
    -webkit-transform: translateY(-9px) rotate(-45deg);
    -moz-transform: translateY(-9px) rotate(-45deg);
    -ms-transform: translateY(-9px) rotate(-45deg);
    transform: translateY(-9px) rotate(-45deg);
}
#globalnavi__list {
    width: 100%;
    height: auto;
    background: #fff;
    border-top: 1px solid #646464;
    margin: 0;
    padding: 30px 0 40px 0;
    display: none;
    position: absolute;
    top: 80px;
    left: 0;
    z-index: 100;
}
#globalnavi__list.active {
    display: block;
    animation: show 0.3s linear 0s;
}
.globalnavi__litem {
    text-align: left;
    margin: 0 0 20px 0;
    display: block;
    border-bottom: none;
}
.globalnavi__litem a {
    height: auto;
    text-align: left;
    line-height: 0.8;
    padding: 10px 60px;
    display: block;
}
.globalnavi__litem:hover, .globalnavi__litem.active {
    background: #f7f7f7;
    border-bottom: none;
}
.globalnavi__litem a:hover, .globalnavi__litem.active a {
    color: #666;
}
.globalnavi__litem a br {
    display: none;
}
.switch--second:hover {
    background: none;
}
.switch--second span {
    padding: 10px 60px 20px 60px;
    display: block;
}
.globalnavi__list-second .globalnavi__litem {
    margin: 0 0 10px 0;
}
.globalnavi__list-second .globalnavi__litem:last-child {
    margin-bottom: 0;
}
.globalnavi__list-second .globalnavi__litem a {
    font-size: 13px;
    padding: 5px 60px 5px 70px;
}
}
/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/

/* Footer */

/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/
.footer__wrapper {
    width: 100%;
    background: #000;
    padding: 40px 0;
}
.footer__inner {
    width: 960px;
    text-align: center;
    margin: 0 auto;
}
.copyright {
    color: #969696;
    font-size: 10px;
    text-align: center;
}
.footer__logo {
    margin: 0 0 30px 0;
}
.footer__social {
    margin: 0 0 30px 0;
}
.footer__social .footer_social__item {
    margin: 0 20px;
    display: inline-block;
}
.fb_iframe_widget > span {
    vertical-align: baseline !important;
}

@media screen and (max-width: 768px) {
.footer__wrapper {
}
.footer__inner {
    width: 100%;
}
}
/*--------------------------------------------------------------*/
/* footernavi */
/*--------------------------------------------------------------*/
.footernavi {
    margin: 40px 0;
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
}
.footernavi__item {
    font-weight: 500;
    border-left: 1px solid #969696;
    padding: 0 35px;
}
.footernavi__item:first-child {
    border: none;
}
.footernavi__item a {
    color: #fff;
}

@media screen and (max-width: 768px) {
.footernavi__item {
    font-size: 12px;
    padding: 0 20px;
}
}
/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/

/* pagetop */

/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/
.pagetop {
    height: 60px;
    width: 60px;
    position: fixed;
    bottom: 40px;
    right: 40px;
    transition: 0.5s ease-out;
    opacity: 0;
    z-index: 6;
}
.pagetop a {
    height: 60px;
    width: 60px;
    background: #46c8c8;
    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media screen and (max-width: 768px) {
.pagetop {
    height: 70px;
    width: 70px;
    bottom: 10px;
    right: 10px;
}
.pagetop a {
    height: 70px;
    width: 70px;
    border-radius: 35px;
}
}
/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/

/* breadcrumb */

/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/
.breadcrumb {
    margin: 1rem 0;
}
.breadcrumb__list {
    width: 1198px;
    margin: 0 auto;
}
.breadcrumb__item {
    height: 30px;
    display: inline-block;
    line-height: 30px;
}
.breadcrumb__title {
    display: inline;
    font-size: 1em;
}
.breadcrumb__item a {
    display: inline-block;
}
.breadcrumb__item + li::before {
    content: '>';
    margin: 0 19px;
}
/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/

/* conteiner */

/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/
.conteiner__wrapper {
    width: 100%;
    background: #fff;
    padding-top: 80px;
    overflow: hidden;
    z-index: 2;
}
.conteiner__inner {
    width: 960px;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
.conteiner__inner {
    width: 100%;
    padding: 0 6vw;
}
}
.conteiner__head {
    height: 320px;
    text-align: center;
    background: #c8ebeb;
    margin: 0 0 100px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.conteiner__title {
    font-size: 28px;
    font-weight: bold;
}
.conteiner__lead {
    margin-top: 40px;
}

@media screen and (max-width: 768px) {
.conteiner__head {
    height: 250px;
}
.conteiner__title {
    font-size: 26px;
}
}
/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/

/* content*/

/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/
.content {
    margin-bottom: 150px;
    position: relative;
}
.content__head {
    font-size: 32px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 40px;
}
.content__lead {
    width: 640px;
    line-height: 2;
    margin: 0 auto 30px auto;
}

@media screen and (max-width: 768px) {
.content {
    margin-bottom: 100px;
}
.content__head {
    font-size: 22px;
    margin: 0 auto 30px auto;
}
.content__lead {
    width: 100%;
    margin: 0 auto 30px auto;
}
}
/*--------------------------------------------------------------*/

/* video*/

/*--------------------------------------------------------------*/
.video {
    height: 383px;
    width: 680px;
    background: #999;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
.video {
    height: 54vw;
    width: 100%;
    max-height: 383px;
    max-width: 680px;
}
}
/*--------------------------------------------------------------*/

/* faq*/

/*--------------------------------------------------------------*/
.faq__item {
    padding: 20px 0 40px 0;
    display: none;
}

@media screen and (max-width: 768px) {
.faq__item {
    margin: 0 auto;
}
}
.comment__item {
    height: auto;
    width: 760px;
    background-image: url(../images/about-back.png);
    margin: 50px auto 0 auto;
    padding: 20px 20px;
    position: relative;
}
.comment__arrow {
    height: 30px;
    width: 36px;
    background-image: url(../images/aboutcontent_top.png);
    background-repeat: no-repeat;
    background-size: 36px 30px;
    position: absolute;
    top: -30px;
    left: 0;
    right: 0;
    margin: auto;
}
.comment__title {
    font-size: 22px;
    font-weight: bold;
    text-align: center;
}
.comment__text {
    width: 640px;
    margin: 20px auto;
}

@media screen and (max-width: 768px) {
.comment__item {
    width: 100%;
    padding: 38px;
}
.comment__title {
    font-size: 22px;
}
.comment__text {
    width: 100%;
}
}
.title-overlay__wrapper {
    position: relative;
}
.title-overlay__wrapper .title--overlay {
    height: 55px;
    width: auto;
    position: absolute;
    top: 15px;
    left: -10px;
}
.title--overlay.img--row2 {
    height: 89px;
}

@media screen and (max-width: 768px) {
.title-overlay__wrapper .title--overlay {
    height: 66px;
    position: absolute;
    top: 33px;
    left: -12px;
}
.title--overlay.img--row2 {
    height: 106px;
}
.title-overlay__wrapper .row__img {
    height: 100%;
    position: relative;
    overflow: hidden;
}
.title-overlay__wrapper .row__img img {
    height: 100%;
    width: auto;
    position: absolute;
    bottom: -12%;
    left: 0;
}
}
.text--red {
    color: #ff0000;
    font-size: 1.3em;
}
.title--b-blue {
    font-size: 22px;
    font-weight: bold;
    text-align: center;
    background: #c8ebeb;
    margin: 0 0 10px 0;
    padding: 5px 0;
    position: static;
}

@media screen and (max-width: 768px) {
.title--b-blue {
    font-size: 18px;
}
}
.img-overlay__wrapper {
    position: relative;
}
.img-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
}
.show--pc {
    display: block;
}
.show--sp {
    display: none;
}

@media screen and (max-width: 768px) {
.show--pc {
    display: none;
}
.show--sp {
    display: block;
}
}

@media screen and (max-width: 768px) {
.sp_w100 {
    width: 100%;
}
.mbn_sp {
    margin-bottom: 0;
}
}
/*--------------------------------------------------------------*/

/*0109追加資料のQ数調整_PC13px_sp0px*/

/*--------------------------------------------------------------*/
.font13 {
    font-size: 13px;
}