@charset "utf-8";

/*--
　Main Index
----*/
.contents_top {
width: 100%;
min-width: 1000px;
margin: auto;
box-sizing: border-box;
}

.sec {
width: 100%;
min-width: 1000px;
margin: auto;
box-sizing: border-box;
position: relative;
}

.sec .inner {
max-width: 1000px;
margin: auto;
box-sizing: border-box;
}

/* SP -----*/
@media screen and (max-width: 768px) {
.contents_top {
min-width: 100%;
}

.sec {
min-width: 100%;
}

.sec .inner {
max-width: 100%;
}

.main_ttl.wow.fadeInUp {
    width: 90%;
    margin: auto;
}
}





/*--
  animation
-----*/
@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 15%, 0);
    transform: translate3d(0, 15%, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 15%, 0);
    transform: translate3d(0, 15%, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; }
}





/*--
　MV
----*/
.top_mv {
background: url("img/top_mv.jpg") 0 center no-repeat;
background-size: cover;
width: 100%;
height: 528px;
min-width: 1000px;
box-sizing: border-box;
position: relative;
overflow: hidden;
}

.top_mv .mv_inner {
max-width: 1000px;
margin: auto;
position: relative;
z-index: 1;
}

.top_mv .mv_ttl {
position: absolute;
top: 0;
right: 0;
margin: 6rem 0 0 auto;
color: #fff;
font-size: 4.8rem;
line-height: 1;
}
.top_mv .mv_ttl span {
display: inline-block;
background: rgba(17,17,17,0.7);
margin: 0 0 1.2rem;
padding: 0.5rem 1.5rem;
box-sizing: border-box;
font-weight: bold;
}

.mv_item_wrap {
position: absolute;
top: 50%;
left: 0;
transform: translate(0,-50%);
width: 100%;
z-index: 1;
}

.mv_item {
display: flex;
align-items: center;
background: #fff;
height: 110px;
margin: 0 0 2rem;
padding: 0 2rem 0 0;
position: relative;
z-index: 1;
}
.mv_item:before {
content: "";
position: absolute;
top: 100%;
left: 0;
width: calc(100% + 20px);
border-bottom: 5px solid #1278ad;
}
.mv_item:after {
content: "";
position: absolute;
top: 0;
right: -30px;
width: 0px;
height: 0px;
border-style: solid;
border-width: 0 30px 110px 0;
border-color: #fff;
border-right-color: transparent;
z-index: 1;
}
.mv_item:nth-child(1) {
width: 45%;
}
.mv_item:nth-child(2) {
width: 50%;
}
.mv_item:nth-child(3) {
width: 55%;
}

.mv_item_inner {
width: 100%;
font-size: 3.4rem;
font-weight: bold;
text-align: right;
position: relative;
}
.mv_item_inner:after {
content: "";
display: block;
width: 100%;
border-bottom: 2px solid #277fac;
margin-top: 1rem;
}
.mv_item span {
display: block;
margin: 0 0 1rem;
font-size: 1.6rem;
font-weight: bold;
}


.top_mv_plate {
position: absolute;
top: 0;
bottom: 0;
left: -50%;
right: 50%;
margin: 0 450px 0 0;
overflow: hidden;
z-index: 0;
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: skewX(-25deg);
transform:skewX(-25deg);
}
.top_mv_plate:after {
display: block;
content: "";
position: absolute;
top: 0;
left: -100%;
right: -100%;
bottom: 0;
z-index: 0;
background: #fff;
-webkit-transform: skewX(25deg);
transform: skewX(25deg);
}

/* SP -----*/
@media screen and (max-width: 768px) {
.top_mv {
background: url("img/top_mv.jpg") 0 center no-repeat;
background-size: cover;
width: 100%;
height: auto;
min-width: 100%;
}

.top_mv .mv_inner {
max-width: 100%;
}

.top_mv .mv_ttl {
position: static;
top: inherit;
right: inherit;
margin: 3rem 0 0 1.5rem;
font-size: 2.7rem;
}
.top_mv .mv_ttl span {
margin: 0 0 0.5rem;
padding: 0.5rem 1rem;
}

.mv_item_wrap {
position: static;
top: inherit;
left: inherit;
transform: inherit;
margin: 2rem 0 0;
}

.mv_item {
height: 60px;
margin: 0 0 1rem;
padding: 0 1rem 0 0;
}
.mv_item:before {
border-bottom: 3px solid #1278ad;
}
.mv_item:after {
right: -20px;
border-width: 0 20px 60px 0;
}
.mv_item:nth-child(1) {
width: 50%;
}
.mv_item:nth-child(2) {
width: 70%;
}
.mv_item:nth-child(3) {
width: 90%;
}

.mv_item_inner {
font-size: 2rem;
}
.mv_item_inner:after {
border-bottom: 1px solid #277fac;
margin-top: 0.5rem;
}
.mv_item span {
margin: 0 0 0.5rem;
font-size: 1.1rem;
}


.top_mv_plate {
margin: 0 200px 0 0;
}
}





/*--
　Title
----*/
.main_ttl .sub_ttl {
color: #1278ad;
font-size: 2.6rem;
font-weight: bold;
}

.main_ttl .ttl {
margin: 1.5rem 0 0;
font-size: 4rem;
}


.main_ttl .ttl a {
display: inline-block;
padding: 0 4rem 1rem 0;
border-bottom: 2px solid #1278ad;
position: relative;
}
.main_ttl .ttl a:after {
content: "";
position: absolute;
top: 50%;
right: 0;
width: 16px;
height: 16px;
margin-top: -8px;
border-top: solid 1px #111;
border-right: solid 1px #111;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}

/* SP -----*/
@media screen and (max-width: 768px) {
.main_ttl .sub_ttl {
font-size: 1.5rem;
}

.main_ttl .ttl {
margin: 0.5rem 0 0;
font-size: 2.4rem;
}


.main_ttl .ttl a {
display: block;
padding: 0 4rem 1rem 0;
border-bottom: 1px solid #1278ad;
}
.main_ttl .ttl a:after {
width: 12px;
height: 12px;
margin-top: -6px;
}
}





/*--
　テキスト
----*/
.txt {
font-size: 1.5rem;
line-height: 2;
text-align: justify;
}

.lead {
margin: 3rem 0 0 0;
font-size: 1.5rem;
line-height: 2;
}

/* SP -----*/
@media screen and (max-width: 768px) {
.txt {
line-height: 1.8;
}

.lead {
margin: 2rem 0 0 0;
line-height: 1.8;
}
}





/*--
　comp
----*/
.comp .com_parts01 {
margin: 0 0 0;
}





/*--
　company
----*/
.company .company_upper {
background: #fff;
padding: 7rem 0 15rem;
position: relative;
}
.company .company_upper:after {
content: "";
position: absolute;
top: 0;
right: 0;
background: url("img/bg02.png") right 0 no-repeat;
background-size: 100% auto;
width: 530px;
height: 502px;
}


.company_block .btn-web a {
max-width: 565px;
margin: 4rem auto 0;
}


.company_block_wrap {
margin-top: -9rem;
}

.company .block_wrap {
max-width: 1000px;
margin: 0 auto 8rem;
position: relative;
}
.company .block_wrap:before,
.company .block_wrap:after {
content: "";
position: absolute;
background: #969696;
z-index: 2;
}
.company .block_wrap:before {
top: -5px;
right: -20px;
width: calc(100% - 20px);
height: 1px;
}
.company .block_wrap:after {
top: -20px;
right: -5px;
width: 1px;
height: calc(100% + 40px);
}


.company_block {
background: #f5f8fa;
box-sizing: border-box;
position: relative;
}
.company_block:before,
.company_block:after {
content: "";
position: absolute;
width: 1px;
background: #969696;
z-index: 2;
}
.company_block:before {
top: -20px;
left: 0;
height: calc(100% + 40px);
}
.company_block:after {
top: -30px;
right: 0;
height: calc(100% - 40px);
}


.company_block .company_block_inner {
padding: 7rem 6rem 8rem;
position: relative;
}
.company_block .company_block_inner:before,
.company_block .company_block_inner:after {
content: "";
position: absolute;
left: -20px;
height: 1px;
background: #969696;
z-index: 2;
}
.company_block .company_block_inner:before {
top: 0;
width: calc(100% - 10px);
}
.company_block .company_block_inner:after {
bottom: 0;
width: calc(100% + 40px);
}


.company_block .company_cc_wrap {
display: inline-block;
margin-left: -8rem;
position: relative;
z-index: 3;
}
.company_block .company_cc_wrap:before,
.company_block .company_cc_wrap:after {
content: "";
position: absolute;
background: #969696;
z-index: 2;
}
.company_block .company_cc_wrap:before {
top: -10px;
right: -20px;
width: 100%;
height: 1px;
}
.company_block .company_cc_wrap:after {
top: -15px;
right: -10px;
width: 1px;
height: calc(100% + 40px);
}


.company_block .company_cc {
position: relative;
}
.company_block .company_cc:before,
.company_block .company_cc:after {
content: "";
position: absolute;
width: 1px;
background: #969696;
height: calc(100% + 40px);
z-index: 2;
}
.company_block .company_cc:before {
top: -20px;
left: -5px;
}
.company_block .company_cc:after {
top: -20px;
right: -5px;
}

.company_block .company_cc_inenr {
background: #111;
padding: 1.5rem 8rem 1.5rem 5rem;
box-sizing: border-box;
color: #fff;
font-size: 3rem;
font-weight: bold;
line-height: 1.4;
position: relative;
}
.company_block .company_cc_inenr:before,
.company_block .company_cc_inenr:after {
content: "";
position: absolute;
left: -20px;
height: 1px;
background: #969696;
z-index: 2;
}
.company_block .company_cc_inenr:before {
top: -5px;
width: 100%;
}
.company_block .company_cc_inenr:after {
bottom: -5px;
width: calc(100% + 40px);
}


.company_block .area01_inner01 {
display: flex;
justify-content: space-between;
align-items: flex-end;
margin-top: -13rem;
position: relative;
}
.company_block .area01_inner01 .left {
width: 45%;
box-sizing: border-box;
}
.company_block .area01_inner01 .right {
width: 55%;
height: 37rem;
box-sizing: border-box;
margin: 0 -6rem 0 0;
}

.company_block .caption {
margin: 1.5rem 3rem 0 0;
}


.company_block .area01_inner02 {
display: flex;
justify-content: space-between;
margin: 3rem 0 0;
}

.company_block .c_ttl {
margin: 0 0 2rem;
font-size: 4.8rem;
text-align: center;
}

.company_block .box_item {
width: calc(50% - 2rem);
text-align: center;
}
.company_block .box_item.speed {
width: 100%;
}

.company_block .box_item .box_item_inner {
background: #fff;
padding: 1.5rem 4rem 2rem;
}

.company_block .box_item .box_ttl01 {
background: #d9d9d9;
padding: 1rem 1.5rem;
font-size: 1.6rem;
font-weight: bold;
}

.company_block .box_item .box_ttl02 {
display: flex;
align-items: center;
margin: 2rem 0 2rem;
font-size: 2rem;
font-weight: bold;
}
.company_block .box_item .box_ttl02:before,
.company_block .box_item .box_ttl02:after {
content: "";
display: block;
flex: 1;
border-top: 1px solid #111;
}
.company_block .box_item .box_ttl02:before {
margin-right: 20px;
}
.company_block .box_item .box_ttl02:after {
margin-left: 20px;
}

.company_block .box_item .txt {
width: 100%;
text-align: center;
line-height: 1.8;
}

.company_block .box_item .txt01 {
width: 100%;
margin: 0 0 0.5rem;
font-size: 2.8rem;
font-weight: bold;
}

.company_block .box_item .txt02 {
font-size: 2rem;
font-weight: bold;
}
.company_block .box_item .txt02 span {
font-size: 2.8rem;
font-weight: bold;
}

.company_block .modal {
margin: 2.5rem 0 0;
}


.company_block .point {
margin: 9rem 0 0;
}

.company_block .point_block {
display: flex;
justify-content: space-between;
border-top: 1px solid #c4c6c8;
border-bottom: 1px solid #c4c6c8;
}

.company_block .point_block .box {
width: 50%;
padding: 5rem 5rem 5rem 0;
box-sizing: border-box;
position: relative;
}
.company_block .point_block .box:after {
content: "";
position: absolute;
top: -15px;
right: 0;
background: #c4c6c8;
width: 1px;
height: calc(100% + 30px);
}
.company_block .point_block .box:nth-child(2) {
padding: 5rem 0 5rem 5rem;
}
.company_block .point_block .box:nth-child(2):after {
display: none;
}

.company_block .point_block .p_eng {
background: url("img/ttl_deco01.png") 0 1rem no-repeat;
background-size: 29px auto;
padding-left: 4rem;
color: #326697;
font-size: 2rem;
letter-spacing: 0.1em;
}
.company_block .point_block .p_eng span {
font-size: 3rem;
}

.company_block .point_block .p_ttl {
margin: 2rem 0 0;
font-size: 2.8rem;
font-weight: bold;
line-height: 1.4;
}

.company_block .point_block .txt {
margin: 3rem 0 0;
}



.company_block .ttl02 {
display: inline-block;
background: #1278ad;
height: 55px;
line-height: 55px;
margin-left: -6rem;
padding: 0 3rem;
box-sizing: border-box;
color: #fff;
font-size: 2.4rem;
text-align: center;
position: relative;
}
.company_block .ttl02:after {
position: absolute;
top: 0;
right: -20px;
content: "";
width: 0px;
height: 0px;
border-style: solid;
border-width: 55px 20px 0 0;
border-color: #1278ad;
border-right-color: transparent;
z-index: 1;
}
.company_block .ttl_wrap {
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.company_block .ttl_wrap:after {
content: "";
display: block;
border-top: 1px solid #326697;
flex-grow: 1;
z-index: 2;
}



.company_block .voice {
margin: 9rem 0 0;
}

.company_block .voice_block {
display: flex;
justify-content: space-between;
margin: 4rem 0 0;
}

.company_block .voice_block .box {
background: #fff;
width: calc(33.33% - 1.5rem);
box-sizing: border-box;
position: relative;
}
.company_block .voice_block .box:before,
.company_block .voice_block .box:after {
content: "";
position: absolute;
top: -5px;
width: 1px;
height: calc(100% + 10px);
background: #c4c6c8;
}
.company_block .voice_block .box:before {
left: 0;
}
.company_block .voice_block .box:after {
right: 0;
}

.company_block .voice_block .box_inner {
padding: 3rem 2rem;
box-sizing: border-box;
position: relative;
}
.company_block .voice_block .box_inner:before,
.company_block .voice_block .box_inner:after {
content: "";
position: absolute;
left: -5px;
width: calc(100% + 10px);
height: 1px;
background: #c4c6c8;
}
.company_block .voice_block .box_inner:before {
top: 0;
}
.company_block .voice_block .box_inner:after {
bottom: 0;
}

.company_block .voice_block .cc {
font-size: 2rem;
}

.company_block .voice_block .txt {
margin: 2rem 0 0;
}



.company_block .info {
margin: 9rem 0 0;
}

.company_block .info_block {
margin: 5rem 0 0;
}

.company_block .info_block dl {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.company_block .info_block dt {
width: 15%;
margin: 0 0 2.5rem;
box-sizing: border-box;
font-size: 1.8rem;
font-weight: bold;
}

.company_block .info_block dd {
width: calc(85% - 2rem);
margin: 0 0 2.5rem;
box-sizing: border-box;
font-size: 1.4rem;
line-height: 1.4;
}


/* SP -----*/
@media screen and (max-width: 768px) {
.company .company_upper {
padding: 6rem 1.5rem 4rem;
overflow: hidden;
}
.company .company_upper:after {
top: -3rem;
right: -45%;
background: url("img/bg02.png") right 0 no-repeat;
background-size: 100% auto;
width: 100%;
height: 0;
padding-top: calc(100%*502/530);
z-index: 0;
}


.company_block .btn-web a {
max-width: 90%;
margin: 3rem auto 0;
}

.company_block .btn-tel a {
max-width: 90%;
margin: 1.5rem auto 0;
}


.company_block_wrap {
margin-top: 0;
padding: 0 1.5rem;
box-sizing: border-box;
}

.company .block_wrap {
max-width: 100%;
margin: 0 auto 5rem;
}
.company .block_wrap:last-child {
margin: 0 auto 0;
}
.company .block_wrap:before {
top: -3px;
right: -10px;
width: 100%;
height: 1px;
}
.company .block_wrap:after {
top: -10px;
right: -3px;
width: 1px;
height: calc(100% + 20px);
}


.company_block:before {
top: -10px;
height: calc(100% + 20px);
}
.company_block:after {
top: -15px;
height: calc(100% - 20px);
}


.company_block .company_block_inner {
padding: 3rem 2rem 4rem;
}
.company_block .company_block_inner:before,
.company_block .company_block_inner:after {
left: -10px;
height: 1px;
}
.company_block .company_block_inner:before {
width: 100%;
}
.company_block .company_block_inner:after {
width: calc(100% + 20px);
}


.company_block .company_cc_wrap {
margin-left: -2rem;
}
.company_block .company_cc_wrap:before {
top: -6px;
right: -15px;
width: 100%;
height: 1px;
}
.company_block .company_cc_wrap:after {
top: -10px;
right: -6px;
width: 1px;
height: calc(100% + 20px);
}


.company_block .company_cc:before,
.company_block .company_cc:after {
height: calc(100% + 20px);
}
.company_block .company_cc:before {
top: -10px;
left: -3px;
}
.company_block .company_cc:after {
top: -15px;
right: -3px;
}

.company_block .company_cc_inenr {
padding: 1.2rem 2rem 1.2rem 2rem;
font-size: 2.2rem;
}
.company_block .company_cc_inenr:before,
.company_block .company_cc_inenr:after {
left: -10px;
height: 1px;
}
.company_block .company_cc_inenr:before {
top: -3px;
width: 100%;
}
.company_block .company_cc_inenr:after {
bottom: -3px;
width: calc(100% + 20px);
}


.company_block .img_box {
margin: 2rem 0 0;
}


.company_block .area01_inner01 {
display: block;
margin-top: 2rem;
}
.company_block .area01_inner01 .left {
width: 100%;
}
.company_block .area01_inner01 .right {
width: 100%;
margin: 0 0 0 0;
height: auto;
}

.company_block .caption {
margin: 1rem 0 0 0;
}


.company_block .area01_inner02 {
display: block;
margin: 0 0 0;
}

.company_block .c_ttl {
margin: 0 0 1.5rem;
font-size: 3rem;
}

.company_block .box_item {
width: 100%;
margin: 0 0 1.5rem;
}

.company_block .box_item .box_item_inner {
padding: 1.5rem 1.5rem 2rem;
}

.company_block .box_item .box_ttl01 {
padding: 1rem 1rem;
}

.company_block .box_item .box_ttl02 {
margin: 1.5rem 0 1rem;
font-size: 1.7rem;
}
.company_block .box_item .box_ttl02:before {
margin-right: 1.5rem;
}
.company_block .box_item .box_ttl02:after {
margin-left: 1.5rem;
}

.company_block .box_item .txt {
line-height: 1.6;
}

.company_block .box_item .txt01 {
font-size: 2rem;
}

.company_block .box_item .txt02 {
font-size: 1.8rem;
}
.company_block .box_item .txt02 span {
font-size: 2rem;
}

.company_block .modal {
margin: 2rem 0 0;
}



.company_block .point {
margin: 5rem 0 0;
}

.company_block .point_block {
display: block;
}

.company_block .point_block .box {
width: 100%;
padding: 2rem 0 3rem 0;
}
.company_block .point_block .box:after {
display: none;
}
.company_block .point_block .box:nth-child(2) {
padding: 2rem 0 3rem 0;
border-top: 1px solid #c4c6c8;
}

.company_block .point_block .p_eng {
background: url("img/ttl_deco01.png") 0 1rem no-repeat;
background-size: 20px auto;
padding-left: 2.5rem;
font-size: 1.6rem;
}
.company_block .point_block .p_eng span {
font-size: 2.6rem;
}

.company_block .point_block .p_ttl {
margin: 1rem 0 0;
font-size: 2rem;
}

.company_block .point_block .txt {
margin: 1.5rem 0 0;
}



.company_block .ttl02 {
height: 40px;
line-height: 40px;
margin-left: -2rem;
padding: 0 1.5rem;
font-size: 1.8rem;
}
.company_block .ttl02:after {
right: -10px;
border-width: 40px 10px 0 0;
}


.company_block .voice {
margin: 4rem 0 0;
}

.company_block .voice_block {
display: block;
margin: 2rem 0 0;
}

.company_block .voice_block .box {
width: 100%;
margin: 0 0 2rem;
}
.company_block .voice_block .box:last-child {
margin: 0 0 0;
}

.company_block .voice_block .box_inner {
padding: 2rem 2rem;
}

.company_block .voice_block .cc {
font-size: 1.8rem;
}

.company_block .voice_block .txt {
margin: 1.5rem 0 0;
}



.company_block .info {
margin: 4rem 0 0;
}

.company_block .info_block {
margin: 2rem 0 0;
}

.company_block .info_block dl {
display: block;
}

.company_block .info_block dt {
width: 100%;
margin: 0 0 0.5rem;
font-size: 1.6rem;
}

.company_block .info_block dd {
width: 100%;
margin: 0 0 2rem;
}
}





/*--
　list
----*/
.list {
padding: 16rem 0 12rem;
}
.list:after {
content: "";
position: absolute;
top: 0;
right: 0;
background: url("img/bg03.png") right 0 no-repeat;
background-size: 100% auto;
width: 562px;
height: 599px;
z-index: 0;
}


.list_block {
margin: 6rem 0 0;
position: relative;
z-index: 1;
font-size: 0;
}

.list_block .box_wrap {
display: inline-block;
vertical-align: top;
background: #fff;
width: calc(33.33% - 3rem);
margin: 0 1.5rem;
box-sizing: border-box;
position: relative;
}
.list_block .box_wrap:nth-child(3n-1) {
margin: 4rem 1.5rem 0;
}
.list_block .box_wrap:nth-child(3n) {
margin: 8rem 1.5rem 0;
}
.list_block .box_wrap:before,
.list_block .box_wrap:after {
content: "";
position: absolute;
background: #969696;
z-index: 2;
}
.list_block .box_wrap:before {
top: -5px;
right: -10px;
width: calc(100% - 20px);
height: 1px;
}
.list_block .box_wrap:after {
top: -10px;
right: 0;
width: 1px;
height: calc(100% + 20px);
}


.list_block .box {
position: relative;
}
.list_block .box:before,
.list_block .box:after {
content: "";
position: absolute;
top: -10px;
width: 1px;
height: calc(100% + 20px);
background: #969696;
z-index: 2;
}
.list_block .box:before {
left: 0;
}
.list_block .box:after {
top: -15px;
right: 5px;
}


.list_block .box_inner {
padding: 0.5rem 0 0;
position: relative;
}
.list_block .box_inner:before,
.list_block .box_inner:after {
content: "";
position: absolute;
left: -10px;
height: 1px;
background: #969696;
z-index: 2;
}
.list_block .box_inner:before {
top: 0;
width: calc(100% - 20px);
}
.list_block .box_inner:after {
bottom: 0;
width: calc(100% + 20px);
}

.list_block .ttl a {
display: block;
background: #1278ad;
padding: 1.5rem 4rem;
box-sizing: border-box;
color: #fff;
font-size: 2.6rem;
font-weight: bold;
text-align: center;
line-height: 1.3;
position: relative;
overflow: hidden;
z-index: 1;
transition: .3s;
-webkit-transform: translate3d(0, 0%, 0);
  transform: translate3d(0, 0%, 0);
}
.list_block .ttl a::before {
content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 120%;
  height: 100%;
  background: #0e4a83;
  transform-origin: right top;
  transform: skewX(-30deg) scale(0, 1);
  transition: transform .3s;
}
.list_block .ttl a:hover::before {
  transform-origin: left top;
  transform: skewX(-30deg) scale(1, 1);
}
.list_block .ttl a:hover {
opacity: 1;
}
.list_block .ttl a:after {
content: "";
position: absolute;
top: 50%;
right: 2rem;
width: 12px;
height: 12px;
margin-top: -6px;
border-top: solid 1px #fff;
border-right: solid 1px #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}


.list_block .ft {
background: #d9d9d9;
padding: 1.2rem 1.2rem;
font-size: 1.6rem;
font-weight: bold;
text-align: center;
position: relative;
}
.list_block .ft:after {
content: "";
position: absolute;
top: 100%;
left: 0;
right: 0;
background: #d9d9d9;
width: 1px;
height: 15px;
margin: auto;
}

.list_block .txt {
padding: 2.5rem 2.5rem;
}

/* SP -----*/
@media screen and (max-width: 768px) {
.list {
padding: 7rem 1.5rem 6rem;
overflow: hidden;
}
.list:after {
top: -3rem;
right: -45%;
background: url("img/bg03.png") right 0 no-repeat;
background-size: 100% auto;
width: 100%;
height: 0;
padding-top: calc(100%*599/562);
}


.list_block {
margin: 4rem 0 0;
}

.list_block .box_wrap {
display: block;
width: 100%;
margin: 0 0 3rem;
}
.list_block .box_wrap:last-child {
margin: 0 0 0;
}
.list_block .box_wrap:nth-child(3n-1) {
margin: 0 0 3rem;
}
.list_block .box_wrap:nth-child(3n) {
margin: 0 0 3rem;
}
.list_block .box_wrap:before {
top: -3px;
right: -5px;
width: calc(100% - 10px);
height: 1px;
}
.list_block .box_wrap:after {
top: -5px;
right: 0;
width: 1px;
height: calc(100% + 10px);
}


.list_block .box:before,
.list_block .box:after {
top: -5px;
width: 1px;
height: calc(100% + 10px);
}
.list_block .box:after {
top: -8px;
right: 3px;
}


.list_block .box_inner {
padding: 0.3rem 0 0;
}
.list_block .box_inner:before,
.list_block .box_inner:after {
left: -5px;
height: 1px;
}
.list_block .box_inner:before {
width: calc(100% - 10px);
}
.list_block .box_inner:after {
width: calc(100% + 10px);
}

.list_block .ttl a {
padding: 1.2rem 4rem;
font-size: 2rem;
}
.list_block .ttl a:after {
right: 1.5rem;
width: 8px;
height: 8px;
margin-top: -4px;
}


.list_block .ft {
padding: 1rem 1rem;
font-size: 1.6rem;
}
.list_block .ft:after {
height: 10px;
}

.list_block .txt {
padding: 1.5rem 2rem;
}
}




/*--
　map
----*/
.map {
background: url("img/bg04.jpg") center center no-repeat;
background-size: cover;
padding: 8rem 0 8rem;
}


.map_block {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin: 6rem 0 0;
}

.map_block .box h3 {
line-height: inherit;
}
.map_block .box h3 a:hover {
opacity: 1;
}

.map_block .box {
width: calc(50% - 2rem);
margin: 0 0 3rem 0;
}

.map_block .box a {
display: block;
background: #111;
width: 100%;
padding: 2.5rem 2rem;
box-sizing: border-box;
color: #fff;
  font-size: 1.4rem;
  font-weight: bold;
text-align: center;
border-radius: 20px;
box-shadow: 0px 4px 0px 0px #7b7878;
  position: relative;
  z-index: 1;
  overflow: hidden;
  transition: .3s;
-webkit-transform: translate3d(0, 0%, 0);
  transform: translate3d(0, 0%, 0);
}
.map_block .box a::before {
content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 120%;
  height: 100%;
  background: #22acb1;
  transform-origin: right top;
  transform: skewX(-30deg) scale(0, 1);
  transition: transform .3s;
}
.map_block .box a:hover::before {
  transform-origin: left top;
  transform: skewX(-30deg) scale(1, 1);
}
.map_block .box a:after {
content: "";
position: absolute;
top: 50%;
right: 2.5rem;
width: 14px;
height: 14px;
margin-top: -7px;
border-top: solid 1px #fff;
border-right: solid 1px #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}


.map_block .box span {
font-weight: bold;
}
.map_block .box .spn01 {
font-size: 2.4rem;
}
.map_block .box .spn02 {
font-size: 3rem;
}

/* SP -----*/
@media screen and (max-width: 768px) {
.map {
background: url("img/sp_bg04.jpg") right 0 no-repeat;
background-size: cover;
padding: 5rem 1.5rem 6rem;
}


.map_block {
display: block;
margin: 3rem 0 0;
}

.map_block .box {
width: 100%;
margin: 0 0 1.5rem 0;
}
.map_block .box:last-child {
margin: 0 0 0 0;
}

.map_block .box a {
padding: 1.5rem 3rem;
font-size: 1.3rem;
border-radius: 10px;
}
.map_block .box a:after {
right: 1.5rem;
width: 12px;
height: 12px;
margin-top: -6px;
}


.map_block .box .spn01 {
font-size: 1.9rem;
}
.map_block .box .spn02 {
font-size: 2rem;
}
}





/*--
　type
----*/
.type {
background: #fff;
padding: 14rem 0 8rem;
overflow: hidden;
}


.type_block {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin: 6rem 0 0;
position: relative;
}

.type_block .box {
width: calc(50% - 3rem);
margin: 0 0 8rem;
box-sizing: border-box;
}
.type_block .box:nth-child(2n) {
margin-top: -12rem;
}

.type_block .img_box {
width: 800px;
margin-left: -80%;
}
.type_block .box:nth-child(2n) .img_box {
margin-left: 10%;
}

.type_block .img_box img {
height: 530px;
}

.type_block .txt_box_wrap {
margin-top: -25rem;
position: relative;
}
.type_block .txt_box_wrap:before,
.type_block .txt_box_wrap:after {
content: "";
position: absolute;
background: #969696;
z-index: 2;
}
.type_block .txt_box_wrap:after {
left: -15px;
bottom: -5px;
width: calc(100% - 30px);
height: 1px;
}
.type_block .txt_box_wrap:before {
top: -5px;
right: -5px;
width: 1px;
height: calc(100% + 30px);
}

.type_block .txt_box {
position: relative;
}
.type_block .txt_box:before,
.type_block .txt_box:after {
content: "";
position: absolute;
top: -15px;
width: 1px;
height: calc(100% + 30px);
background: #969696;
z-index: 2;
}
.type_block .txt_box:before {
left: 0;
}
.type_block .txt_box:after {
right: 0;
}

.type_block .txt_box_inner {
padding: 1rem 0 0;
position: relative;
}
.type_block .txt_box_inner:before,
.type_block .txt_box_inner:after {
content: "";
position: absolute;
height: 1px;
background: #969696;
z-index: 2;
}
.type_block .txt_box_inner:before {
top: 0;
left: -15px;
width: calc(100% + 30px);
}
.type_block .txt_box_inner:after {
bottom: 0;
right: -15px;
width: calc(100% - 30px);
}


.type_block .ttl {
display: block;
background: #1278ad;
padding: 2rem 1rem;
box-sizing: border-box;
color: #fff;
font-size: 2.6rem;
font-weight: bold;
text-align: center;
line-height: 1.3;
position: relative;
overflow: hidden;
z-index: 1;
transition: .3s;
}
.type_block .ttl a::before {
content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 120%;
  height: 100%;
  background: #0e4a83;
  transform-origin: right top;
  transform: skewX(-30deg) scale(0, 1);
  transition: transform .3s;
}
.type_block .ttl a:hover::before {
  transform-origin: left top;
  transform: skewX(-30deg) scale(1, 1);
}
.type_block .ttl a:hover {
opacity: 1;
}
.type_block .ttl a:after {
content: "";
position: absolute;
top: 50%;
right: 2rem;
width: 12px;
height: 12px;
margin-top: -6px;
border-top: solid 1px #fff;
border-right: solid 1px #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}

.type_block .txt {
background: #fff;
padding: 2rem 3rem;
box-sizing: border-box;
}

/* SP -----*/
@media screen and (max-width: 768px) {
.type {
padding: 5rem 0 6rem;
}


.type_block {
display: block;
margin: 4rem 0 0;
}

.type_block .box {
width: 100%;
margin: 0 0 6rem;
}
.type_block .box:last-child {
margin: 0 0 0;
}
.type_block .box:nth-child(2n) {
margin-top: 0;
}

.type_block .img_box {
width: 90%;
margin-left: 0;
}
.type_block .box:nth-child(2n) .img_box {
margin-left: inherit;
margin: 0 0 0 auto;
}

.type_block .img_box img {
height: auto;
}

.type_block .txt_box_wrap {
width: 90%;
margin: 0 1.5rem 0 auto;
margin-top: -10%;
}
.type_block .box:nth-child(2n) .txt_box_wrap {
margin: 0 auto 0 1.5rem;
margin-top: -10%;
}

.type_block .txt_box_wrap:after {
left: -10px;
bottom: -3px;
width: calc(100% - 20px);
height: 1px;
}
.type_block .txt_box_wrap:before {
top: -3px;
right: -3px;
width: 1px;
height: calc(100% + 20px);
}

.type_block .txt_box:before,
.type_block .txt_box:after {
top: -10px;
width: 1px;
height: calc(100% + 20px);
}

.type_block .txt_box_inner {
padding: 0.5rem 0 0;
opacity: 0.9;
}
.type_block .txt_box_inner:before {
top: 0;
left: -10px;
width: calc(100% + 20px);
}
.type_block .txt_box_inner:after {
bottom: 0;
right: -10px;
width: calc(100% - 20px);
}


.type_block .ttl a {
padding: 1.5rem 4rem;
font-size: 1.8rem;
}
.type_block .ttl a:after {
right: 1.5rem;
width: 8px;
height: 8px;
margin-top: -4px;
}

.type_block .txt {
padding: 1.5rem 2rem;
}
}





/*--
　pr
----*/
.pr {
background: url("img/bg05.jpg") center center no-repeat;
background-size: cover;
padding: 0 0 8rem;
position: relative;
overflow: hidden;
}

.pr_block {
width: 70%;
margin: 0 0 0 auto;
padding: 7rem 5rem 7rem;
box-sizing: border-box;
position: relative;
z-index: 1;
}

.pr_block .txt {
margin: 3rem 0 0;
}

.pr_block .btn-internal a {
max-width: 400px;
margin: 3rem 0 0 auto;
font-size: 1.6rem;
}

.pr_plate {
position: absolute;
top: 0;
left: 50%;
right: -100%;
bottom: 0;
margin: 0 0 0 -540px;
overflow: hidden;
z-index: -1;
-webkit-transform: skewX(-20deg);
transform: skewX(-20deg);
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
}
.pr_plate:after {
display: block;
content: "";
position: absolute;
top: 0;
left: -100%;
right: -100%;
bottom: 0;
background: rgba(255,255,255,0.8);
z-index: -1;
}

/* SP -----*/
@media screen and (max-width: 768px) {
.pr {
background: none;
padding: 0 0 6rem;
}

.pr .block_wrap {
background: url("img/bg05.jpg") center center no-repeat;
background-size: cover;
box-sizing: border-box;
padding: 0 0 5rem;
position: relative;
z-index: 1;
}

.pr_block {
width: 75%;
margin: 0 0 0 auto;
padding: 3rem 0 3rem;
}

.pr_block .txt {
margin: 0 0 0;
}

.pr .txt_box {
margin: 2rem 0 0;
padding: 0 1.5rem;
box-sizing: border-box;
}

.pr .btn-internal a {
max-width: 85%;
margin: 2rem auto 0 auto;
font-size: 1.4rem;
}

.pr_plate {
margin: 0 0 0 -80%;
}
}





/*--
　qa
----*/
.qa {
background: #fff;
padding: 10rem 0 13rem;
}
.qa:after {
content: "";
position: absolute;
top: 0;
right: 0;
background: url("img/bg06.png") right 0 no-repeat;
background-size: 100% auto;
width: 533px;
height: 630px;
z-index: 0;
}


.qa_block {
display: flex;
justify-content: space-between;
margin: 6rem 0 0;
border: 1px solid #d0d0d0;
position: relative;
z-index: 1;
}

.qa_block .box {
background: #22acb1;
width: 33.33%;
box-sizing: border-box;
}
.qa_block .box:nth-child(3n-1) {
border-left: 1px solid #d0d0d0;
border-right: 1px solid #d0d0d0;
}

.qa_block .box a {
background: #fff;
width: 100%;
height: 100%;
padding: 3rem 3rem;
box-sizing: border-box;
-webkit-transform: translate3d(0, 0%, 0);
  transform: translate3d(0, 0%, 0);
}
.qa_block .box a:hover {
  transform-origin: right top;
  transform: perspective(2000) rotateX(5deg) rotateY(-8deg) rotateZ(1deg);
opacity: 1;
}

.qa_block .ttl {
display: flex;
align-items: center;
padding: 0 0 1.5rem;
font-size: 2.8rem;
border-bottom: 1px solid #dcdfe1;
transition: all 0.3s ease;
}
.qa_block .box a:hover .ttl {
color: #22acb1;
}

.qa_block .txt {
margin: 2rem 0 0;
}

/* SP -----*/
@media screen and (max-width: 768px) {
.qa {
background: #f5f8fa;
padding: 5rem 1.5rem 6rem;
overflow: hidden;
}
.qa:after {
right: -1.5rem;
background: url("img/bg06.png") right 0 no-repeat;
background-size: 100% auto;
width: 100%;
height: 0;
padding-top: calc(100%*630/533);
}


.qa_block {
display: block;
margin: 3rem 0 0;
border: none;
}

.qa_block .box {
width: 100%;
margin: 0 0 2rem;
border: 1px solid #d0d0d0;
}
.qa_block .box:last-child {
margin: 0 0 0;
}

.qa_block .box a {
padding: 2rem 2rem;
}

.qa_block .ttl {
display: block;
padding: 0 0 1rem;
font-size: 1.8rem;
}

.qa_block .txt {
margin: 1.5rem 0 0;
}
}