.freephone_icon {
fill: #231f20;
fill-rule: evenodd
}
@-moz-document url-prefix() {
span.v_circle {
transform: translateY(-35%)
}
}
html, body, h1, h2, h3, h4, ol, ul, li, p {
margin: 0;
padding: 0
}
ol, ul, li {
list-style: none
}
html {
font-size: 62.5%;
width: 100%;
}
html.fixed {
position: fixed;
}
body {
font-size: 16px;
font-size: 1.8rem;
position: relative
}
main {
display: block;
overflow: hidden;
}
a:focus, *:focus {
outline: none
}
a {
text-decoration: none;
-webkit-tap-highlight-color: transparent;
outline: none;
-webkit-transition: all 0.5s ease-out;
transition: all 0.5s ease-out
}
input, textarea {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
font-size: 16px;
font-size: 1.6rem;
background: #f5f5f5;
border-radius: 10px;
border: none;
padding: 10px
}
a img, a::before, a::after, a.hover:hover, a span, button, .menu, .menu span::before, .menu span::after, #gnav_sp, #go-top, .image, .inner-list, span.arrow::before, span.arrow::after, .nav_text::after {
-webkit-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
text-decoration: none;
}
.b_g {
background: #f5f5f5 !important
}
@media screen and (max-width: 750px) {
.pc {
display: none !important
}
}
.sp {
display: none
}
@media screen and (max-width: 750px) {
.sp {
display: block
}
}
.flex_col {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 100%;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between
}
@media screen and (max-width: 750px) {
.col_3 {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-flow: column;
flex-flow: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center
}
}
.col_4 .box:nth-of-type(2n+2) {
margin-left: 60px
}
.col_4 .box:nth-of-type(n+3) {
margin-top: 60px
}
@media screen and (max-width: 1060px) {
.col_4 .box:nth-of-type(2n+2) {
margin-left: 0
}
}
@media screen and (max-width: 750px) {
.col_4 .box {
margin-top: 40px
}
.col_4 .box:nth-of-type(n+3) {
margin-top: 40px
}
}
.box {
border-radius: 20px;
-webkit-box-sizing: border-box;
box-sizing: border-box
}
.common {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 100px 20px;
width: 100%
}
.common_inner {
margin: 0 auto;
max-width: 1080px;
width: 100%
}
.contents_body {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}
h2, h3 {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
margin-bottom: 60px;
text-align: center
}
h2 {
font-size: 42px;
font-size: 4.2rem;
color: #224C6E;
}
@media screen and (max-width: 750px) {
h2 {
font-size: 26px;
font-size: 2.3rem
}
.reason .reason_title {
font-size: 1em;
}
.reason .balloon {
width: 80px;
height: 80px;
top: -100px;
right: -105px;
}
.common {
padding: 80px 20px;
}
}
h2, h3, h4 {
font-weight: 700
}
.tag {
text-align: center;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
position: absolute
}
.tag span {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
color: #fff;
font-style: italic
}
.tag.before {
font-size: 16px;
font-size: 1.6rem;
background: #666;
line-height: 130px;
width: 120px;
height: 80px;
top: -30px;
left: -50px
}
.tag.after {
font-size: 20px;
font-size: 2rem;
background: #9f263c;
line-height: 150px;
width: 165px;
height: 95px;
top: -35px;
left: -75px
}
header .header_inner .menu {
display: none;
background: #151c51;
width: 80px;
height: 80px;
position: absolute;
top: 0;
right: 0;
cursor: pointer;
}
header .header_inner .menu {
background: #151c51;
}
header .header_inner .nav_pc {
display: flex;
justify-content: flex-end;
width: 100%;
}
header .header_inner .nav_sp {
display: none;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp {
border-left: 1px solid #eee;
background: rgba(255, 255, 255, 0.9);
width: 50%;
height: calc(100% - 80px);
position: fixed;
top: 80px;
left: auto;
right: -100%;
padding: 2.5em 2.5em 0;
overflow-y: scroll;
overflow-x: hidden;
-webkit-overflow-scrolling: touch;
box-sizing: border-box;
}
}
@media only screen and (max-width: 750px) {
header .header_inner #gnav_sp {
border-left: none;
width: 100%;
height: calc(100% - 60px);
top: 60px;
padding: 2.5em 1.25em 0;
}
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp.gnav_on {
right: 0;
}
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner {
position: relative;
top: 0;
}
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner > ul {
padding-bottom: 2.5em;
}
}
@media only screen and (max-width: 750px) {
header .header_inner #gnav_sp .gnav-inner > ul {
padding-bottom: 1.25em;
}
}
header .header_inner #gnav_sp .gnav-inner > ul > li > a {
white-space: nowrap;
}
header .header_inner #gnav_sp .gnav-inner ul {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-flow: column;
flex-flow: column;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
}
header .header_inner #gnav_sp .gnav-inner ul li {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
font-weight: bold;
padding-left: 2.5em;
height: 6.25em;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-flow: column;
flex-flow: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
header .header_inner #gnav_sp .gnav-inner ul li a span.arrow {
width: 75px;
height: 15px;
display: none;
position: absolute;
top: 0;
right: 0;
}
header .header_inner #gnav_sp .gnav-inner ul li a span.arrow::before, header .header_inner #gnav_sp .gnav-inner ul li a span.arrow::after {
content: "";
display: block;
position: absolute;
background: #fff;
}
header .header_inner #gnav_sp .gnav-inner ul li a span.arrow::before {
width: 100%;
height: 1px;
right: 3px;
bottom: 0;
}
header .header_inner #gnav_sp .gnav-inner ul li a span.arrow::after {
width: 30px;
height: 1px;
-webkit-transform: rotate(30deg);
transform: rotate(30deg);
right: 0;
bottom: 7px;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li.tel-box .contact {
margin-right: 0
}
header .header_inner #gnav_sp .gnav-inner ul li a span.arrow {
display: block;
}
header .header_inner #gnav_sp .gnav-inner ul li.tel-box {
padding: 2em 0;
}
}
@media only screen and (max-width: 750px) {
header .header_inner #gnav_sp .gnav-inner ul li.tel-box {
box-sizing: border-box;
padding: 2em 1em;
}
}
header .header_inner #gnav_sp .gnav-inner ul li a span.arrow::before, header .header_inner #gnav_sp .gnav-inner ul li a span.arrow::after {
background: #151c51;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li {
padding-left: 0;
width: 100%;
height: auto;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
header .header_inner #gnav_sp .gnav-inner ul li:not(:last-child) {
margin-bottom: 1.25em;
}
}
header .header_inner #gnav_sp .gnav-inner ul li a {
position: relative;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li a {
color: #151c51;
font-size: .8em;
display: block;
width: 100%;
padding-bottom: 0.625em;
margin-bottom: 0.9375em;
position: relative;
}
}
@media only screen and (max-width: 750px) {
header .header_inner #gnav_sp .gnav-inner ul li a {
border-bottom: none;
margin-bottom: 0.625em;
}
}
header .header_inner #gnav_sp .gnav-inner ul li a::before {
content: "";
position: absolute;
top: 2em;
display: block;
background: #151c51;
width: 0;
height: 2px;
}
header .header_inner #gnav_sp .gnav-inner ul li a.current, header .header_inner #gnav_sp .gnav-inner ul li a.current_on {
color: #151c51;
}
header .header_inner #gnav_sp .gnav-inner ul li a.current::before, header .header_inner #gnav_sp .gnav-inner ul li a.current_on::before {
width: 100%;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li a.current::before, header .header_inner #gnav_sp .gnav-inner ul li a.current_on::before {
width: 0;
}
}
header .header_inner #gnav_sp .gnav-inner ul li a span.arrow {
display: none;
position: absolute;
top: 0;
right: 0;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li a span.arrow {
display: block;
}
}
header .header_inner #gnav_sp .gnav-inner ul li a span.arrow::before, header .header_inner #gnav_sp .gnav-inner ul li a span.arrow::after {
background: #151c51;
}
header .header_inner #gnav_sp .gnav-inner ul li a.hover:hover {
color: #151c51;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li a.hover:hover {
border-bottom: 1px solid #231815;
color: #231815;
}
}
@media only screen and (max-width: 750px) {
header .header_inner #gnav_sp .gnav-inner ul li a.hover:hover {
border-bottom: none;
}
}
header .header_inner #gnav_sp .gnav-inner ul li a.hover:hover::before {
width: 100%;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li a.hover:hover::before {
width: 0;
}
}
header .header_inner #gnav_sp .gnav-inner ul li a.hover:hover span.arrow::before, header .header_inner #gnav_sp .gnav-inner ul li a.hover:hover span.arrow::after {
background: #231815;
}
header .header_inner #gnav_sp .gnav-inner ul li.nav-box {
font-size: 12px;
font-size: 0.75rem;
color: #fff;
font-weight: normal;
width: 100px;
height: 100px;
padding-left: 0;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li.nav-box {
width: 100%;
height: auto;
}
}
header .header_inner #gnav_sp .gnav-inner ul li.nav-box a {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-flow: column;
flex-flow: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #fff;
width: 100%;
height: 100%;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li.nav-box a {
border-bottom: none;
padding-top: .75em;
padding-bottom: .75em;
margin-bottom: 0;
font-size: 3em;
}
}
header .header_inner #gnav_sp .gnav-inner ul li.nav-box a.hover:hover {
color: #fff;
background-color: #231815;
}
header .header_inner #gnav_sp .gnav-inner ul li.nav-box a.hover:hover::before {
display: none;
}
header .header_inner #gnav_sp .gnav-inner ul li.nav-box a svg {
margin: 0.1em auto 0.5em;
}
header .header_inner #gnav_sp .gnav-inner ul li.nav-box a {
background-color: #f6921e;
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list {
background: rgba(35, 24, 21, 0.8);
position: absolute;
width: 100%;
top: -999px;
left: 0;
z-index: -1;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li .inner-list {
background: none;
position: relative;
top: 0;
z-index: 0;
display: none;
}
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner {
margin: 2.5em auto 1.25em;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner {
margin: 0 auto;
padding-left: 0;
padding-right: 0;
}
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li {
width: 25%;
height: 100%;
padding-left: 1em;
margin-bottom: 1.25em;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li {
width: 100%;
height: auto;
padding-left: 0;
margin-bottom: 0.625em;
}
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a {
display: block;
width: 100%;
color: #fff;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a {
border-bottom: none;
color: #231815;
padding-bottom: 0;
padding-left: 1.25em;
margin-bottom: 0.625em;
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a::before {
content: "";
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
display: block;
background: #231815;
width: 0.625em;
height: 1px;
}
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a .image {
background-size: auto 100%;
background-position: center;
background-repeat: no-repeat;
padding-top: 65.82%;
margin-bottom: 0.65em;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a .image {
display: none;
}
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a .nav_text {
position: relative;
padding-left: 1.25em;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a .nav_text {
padding-left: 0;
}
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a .nav_text::after {
content: '';
width: 10px;
height: 10px;
border: 0px;
border-top: solid 1px #fff;
border-right: solid 1px #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
position: absolute;
top: 0.5em;
left: 0;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a .nav_text::after {
display: none;
}
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a .nav_text span.nav_lead, header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a .nav_text span.inb {
font-size: 12px;
font-size: 0.75rem;
display: inline-block;
width: 100%;
font-weight: normal;
-webkit-transition: none;
transition: none;
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a .nav_text span.inb {
width: auto;
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a.hover:hover {
color: #aaa;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a.hover:hover {
color: #151c51;
}
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a.hover:hover::before {
display: none;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a.hover:hover::before {
display: block;
background: #151c51;
}
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a.hover:hover .image {
background-size: auto 125%;
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li a.hover:hover .nav_text::after {
border-top: solid 1px #aaa;
border-right: solid 1px #aaa;
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li:nth-child(4n-3) {
width: calc(25% - 1em);
padding-left: 0;
}
@media only screen and (max-width: 1080px) {
header .header_inner #gnav_sp .gnav-inner ul li .inner-list ul.common-inner li:nth-child(4n-3) {
width: 100%;
}
}
header .header_inner #gnav_sp .gnav-inner ul li .inner-list.on {
top: 6.25em;
}
header .header_inner #gnav_sp .gnav-inner ul li.product .inner-list ul.common-inner li a .nav_text, header .header_inner #gnav_sp .gnav-inner ul li.about .inner-list ul.common-inner li a .nav_text {
padding-left: 0;
}
header .header_inner #gnav_sp .gnav-inner ul li.product .inner-list ul.common-inner li a .nav_text::after, header .header_inner #gnav_sp .gnav-inner ul li.about .inner-list ul.common-inner li a .nav_text::after {
display: none;
}
@media only screen and (max-width: 1080px) {
header .header_inner .menu {
display: block;
width: 80px;
height: 80px;
}
header .header_inner .nav_pc {
display: none
}
header .header_inner .nav_sp {
display: block;
}
}
@media only screen and (max-width: 750px) {
header .header_inner .menu {
width: 60px;
height: 60px;
}
}
header .header_inner .menu span {
position: absolute;
background: #fff;
width: 40%;
height: 2px;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
header .header_inner .menu span::before, header .header_inner .menu span::after {
content: "";
display: block;
position: absolute;
background: #fff;
width: 100%;
height: 2px;
}
header .header_inner .menu span::before {
bottom: 0.75em;
-webkit-transform: rotate(0);
transform: rotate(0);
}
header .header_inner .menu span::after {
top: 0.75em;
-webkit-transform: rotate(0);
transform: rotate(0);
}
header .header_inner .menu.menu-on span {
background: none;
}
header .header_inner .menu.menu-on span::before {
bottom: 0;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
header .header_inner .menu.menu-on span::after {
top: 0em;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.btn_area {
background: #9f263c;
margin: 0 auto;
padding: 60px 20px
}
.btn_area .btn_area_inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin: 0 auto;
max-width: 1000px;
width: 100%
}
.btn_area .btn_area_inner .btn {
margin: 0 60px 0 0
}
.btn_area .btn_area_inner .freephone_box {
-webkit-box-sizing: border-box;
box-sizing: border-box;
border: 2px solid #fff;
max-width: 400px;
text-align: center;
width: 100%;
height: 80px
}
.btn_area .btn_area_inner .freephone_box .freephone_icon {
fill: #fff
}
.btn_area .btn_area_inner .freephone_box span.tel_link {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
font-size: 32px;
font-size: 3.2rem;
color: #fff;
line-height: 1.4
}
.btn_area .btn_area_inner .freephone_box p {
font-size: 15px;
font-size: 1.5rem
}
.btn_area p {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
font-size: 32px;
font-size: 3.2rem;
color: #fff;
margin-bottom: 30px;
text-align: center
}
@media screen and (max-width: 1060px) {
.btn_area .btn_area_inner {
-ms-flex-wrap: wrap;
flex-wrap: wrap
}
.btn_area .btn_area_inner .btn {
margin: 0 auto 20px
}
.btn_area .btn_area_inner .freephone_box {
margin: 0 auto;
padding: 5px 0;
max-width: 530px;
height: 70px
}
.btn_area .btn_area_inner .freephone_box span.tel_link {
font-size: 24px;
font-size: 2.4rem
}
.btn_area p {
font-size: 24px;
font-size: 2.4rem
}
}
@media screen and (max-width: 640px) {
.btn_area {
padding: 30px 20px
}
.btn_area .btn_area_inner .freephone_box svg {
margin-top: 5px;
vertical-align: top
}
h3.deco .stripe {
padding: 0 40px;
font-size: 1.8rem;
}
h3.deco .stripe::before, h3.deco .stripe::after {
width: 30px;
}
}
.btn {
border-radius: 40px;
-webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.35);
box-shadow: 0 0 30px rgba(0, 0, 0, 0.35);
margin: 0 auto;
text-align: center;
line-height: 1.5;
max-width: 520px;
width: 100%;
height: 80px;
position: relative;
overflow: hidden;
display: flex;
justify-content: center;
}
.btn a {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
font-size: 32px;
font-size: 3.2rem;
font-weight: 600;
background: #1BB08F;
color: #fff;
display: block;
width: 100%;
height: 100%;
-webkit-transition: all 0.5s ease-out;
transition: all 0.5s ease-out
}
.btn svg {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%)
}
.btn svg path {
-webkit-transition: all 0.5s ease-out;
transition: all 0.5s ease-out
}
.btn svg.book_icon {
fill: #fff;
left: 55px
}
.btn svg.arrow {
fill: #fff;
right: 30px
}
@media screen and (max-width: 750px) {
.btn {
/* line-height: 59px;*/
height: 60px
}
.btn a {
font-size: 20px;
font-size: 2rem
}
.btn svg.book_icon {
width: 30px;
left: 35px
}
.btn svg.arrow {
width: 13px;
right: 20px
}
}
@media screen and (max-width: 320px) {
.btn a {
font-size: 18px;
font-size: 1.8rem
}
.btn svg.book_icon {
width: 20px;
left: 25px
}
.btn svg.arrow {
width: 9px
}
}
.btn a.hover:hover {
background: #2A554F;
color: #fff;
}
.btn a.hover:hover svg.book_icon {
fill: #333
}
.btn a.hover:hover svg.arrow {
fill: #333
}
.submit_btn {
-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.35);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.35);
background: #316464;
-webkit-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out
}
.submit_btn input {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
font-size: 32px;
font-size: 3.2rem;
font-weight: 500;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: none;
color: #fff;
width: 100%;
height: 100%;
cursor: pointer;
-webkit-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.submit_btn svg {
right: 40px;
}
.submit_btn svg .arrow {
fill: #fff;
}
.submit_btn.hover:hover input {
color: #fff;
}
.submit_btn.hover:hover {
background: #2A554F;
color: #fff;
}
.submit_btn.hover:hover svg .arrow {
fill: #000;
}
@media screen and (max-width: 750px) {
.submit_btn input {
font-size: 20px;
font-size: 2rem;
}
.submit_btn svg {
width: 13px;
right: 20px;
}
}
header {
display: block;
background: #fff;
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
width: 100%;
height: 80px;
position: fixed;
top: 0;
z-index: 10;
}
header .header_inner {
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
margin: 0 auto;
padding: 14px 30px;
max-width: 1500px;
width: 100%;
height: 80px;
position: relative
}
header .header_inner h1 {
width: 340px;
height: 66px;
position: absolute;
top: 50%;
left: 20px;
transform: translateY(-50%);
overflow-y: hidden
}
header .header_inner h1 a {
display: block
}
header .header_inner h1 a img {
width: 100%
}
header .header_inner .contact {
width: 273px;
height: 52px;
margin-right: 2em;
}
header .header_inner .btn {
-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.35);
box-shadow: 0 0 3px rgba(0, 0, 0, 0.35);
margin: 0;
line-height: 53px;
max-width: 290px;
height: 52px
}
header .header_inner .btn a {
font-size: 18px;
font-size: 1.8rem;
background: #f6921e;
color: #fff
}
header .header_inner .btn a .book_icon {
fill: #fff;
left: 25px
}
header .header_inner .btn a .arrow {
fill: #fff;
right: 20px
}
header .header_inner .btn a.hover:hover .book_icon {
fill: #000
}
header .header_inner .btn a.hover:hover .arrow {
fill: #000
}
header .header_inner .freephone {
margin-left: 20px;
max-width: 375px;
width: 100%
}
header .header_inner .freephone svg {
padding: 10px 0;
float: left
}
header .header_inner .freephone span.tel_link {
font-size: 28px;
font-size: 2.8rem;
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
color: #333;
float: left;
line-height: 1.6
}
header .header_inner .freephone p {
font-size: 15px;
font-size: 1.5rem;
float: left;
margin: 7px 0 0 15px;
line-height: 1.2
}
header .header_inner .freephone p span {
font-size: 14px;
font-size: 1.4rem;
display: block
}
header .header_menu {
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin: 0 auto;
padding: 7px 30px;
max-width: 1000px;
width: 100%;
position: relative;
}
header .header_menu .menu {
width: 25%;
border-right: 1px dashed #000;
}
header .header_menu .menu:first-child {
border-left: 1px dashed #000;
}
header .header_menu .menu a p {
color: #333;
font-size: 14px;
text-align: center;
display: block;
padding: 4px 0;
}
header .header_menu .menu a .menu_underline {
width: 0;
height: 3px;
background: #9f263c;
transition: width ease-out .2s;
}
header .header_menu .menu a:hover .menu_underline {
width: 100%;
}
@media screen and (max-width: 1060px) {
header .header_inner .btn {
max-width: 300px
}
header .header_inner .btn a.hover:hover .arrow {
fill: #fff
}
header .header_inner .freephone {
max-width: 210px
}
header .header_inner .freephone svg {
padding: 0;
width: 40px
}
header .header_inner .freephone span.tel_link {
font-size: 20px;
font-size: 2rem;
line-height: 1.2
}
header .header_inner .freephone p {
font-size: 12px;
font-size: 1.2rem;
margin: 0
}
header .header_inner .freephone p span {
font-size: 12px;
font-size: 1.2rem;
display: inline
}
}
@media screen and (max-width: 750px) {
header {
height: 60px;
}
header .header_inner {
padding: 10px;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
height: 60px;
}
header .header_inner h1 {
width: 200px;
height: 40px;
}
header .header_inner .btn {
margin-left: 0;
max-width: 200px
}
}
@media screen and (max-width: 750px) and (max-width: 320px) {
header .header_inner .btn {
max-width: 120px
}
}
@media screen and (max-width: 750px) {
header .header_inner .btn a {
font-size: 15px;
font-size: 1.5rem
}
header .header_inner .btn a .book_icon {
display: none
}
header .header_inner .btn a .arrow {
display: none
}
header .header_inner .freephone {
margin-left: 10px;
max-width: 180px
}
header .header_inner .freephone svg {
width: 30px
}
header .header_inner .freephone span.tel_link {
font-size: 20px;
font-size: 2rem;
margin-left: 5px
}
header .header_inner .freephone p {
font-size: 8px;
font-size: .8rem
}
header .header_inner .freephone p span {
font-size: 8px;
font-size: .8rem
}
}
#top {
margin-top: 80px;
}
#top .top_inner {
position: relative;
background: url(../../com/img/kv_pc_hokkaido.jpg)center bottom/cover no-repeat;
width: 100%;
padding-bottom: 42%
}
#top .top_inner.nagano {
background: url(../../com/img/kv_pc_nagano.jpg)center bottom/cover no-repeat;
}
#top .top_inner.nagano2 {
background: url(../../com/img/kv_pc_nagano2.jpg)center bottom/cover no-repeat;
}
#top .top_inner.niigata {
background: url(../../com/img/kv_pc_niigata.jpg)center bottom/cover no-repeat;
}
#top .top_inner_content {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
color: #316464;
/* font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;*/
text-align: center;
font-size: 1.15em;
background-color: #fff;
box-shadow: 0 10px 10px 0 rgba(0, 0, 0, .5);
padding: 50px;
}
#top .top_inner_title {
font-size: 2.5em;
font-weight: 600;
line-height: 1.0;
margin-bottom: .5em;
}
#top .top_inner_title small {
font-size: .6em;
}
#top .top_inner_title span {
font-size: .73em;
}
#top .top_inner_conv .strong_point {
font-size: 2.3em;
font-weight: 600;
line-height: 1.0;
}
#top .top_inner_conv .strong_point .num {
font-family: futura-pt, sans-serif;
font-style: italic;
font-size: 2em;
font-weight: 600;
margin-right: 7px;
}
#top .top_inner_conv .button_heading {
font-size: 1.8em;
font-weight: 600;
color: #D88A4F;
margin-top: 10px;
}
#top .top_inner_conv .button a {
display: block;
font-size: 1.75em;
font-weight: 600;
color: #fff;
/* background-color: #316464;*/
background-color: #fd7e00;
padding: .5em;
width: 90%;
border-radius: 4em;
box-sizing: border-box;
margin: 20px 5%;
}
#relief-2 .relief_inner .button-settime a {
position: absolute;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
display: block;
font-size: 1.5em;
font-weight: 600;
color: #fff;
background-color: #f6921e;
padding: .5em;
width: 16em;
border-radius: 4em;
box-sizing: border-box;
margin: 5px 5px;
}
#top .top_inner_conv .button a:hover, #relief-2 .relief_inner .button-settime a:hover {
/* background: #ffb26c;*/
background: #e46a00;
color: #fff;
}
#top .top_inner_conv .limit {
font-size: 1.2em;
font-weight: 500;
}
@media screen and (max-width: 1600px) {
#top .top_inner_content {
font-size: .9em;
}
}
@media screen and (max-width: 1280px) {
#top .top_inner_content {
font-size: .6em;
}
}
@media screen and (max-width: 810px) {
#top .top_inner {
background: url(../../com/img/kv_sp_hokkaido.jpg)center bottom/cover no-repeat;
padding-bottom: 138.5%
}
#top .top_inner.nagano {
background: url(../../com/img/kv_sp_nagano.jpg)center bottom/cover no-repeat;
}
#top .top_inner.nagano2 {
background: url(../../com/img/kv_sp_nagano2.jpg)center top/contain no-repeat;
}
#top .top_inner.niigata {
background: url(../../com/img/kv_sp_niigata.jpg)center bottom/cover no-repeat;
}
#top .top_inner_content {
left: 50%;
top: 25%;
font-size: .9em;
width: 60%;
}
}
@media screen and (max-width: 750px) {
#top {
margin-top: 60px;
}
#top .top_inner {
padding-bottom: 100%
}
#top .top_inner_content {
top: 50%;
font-size: .6em;
width: 90%;
box-shadow: 0 5px 5px 0 rgba(0, 0, 0, .5);
padding: 30px 20px 0;
}
#top .top_inner_conv img {
width: 80%;
margin-top: 0.5em;
}
#relief-2 .relief_inner .button-settime a {
position: absolute;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
display: block;
font-size: 1em;
font-weight: 600;
color: #fff;
background-color: #f6921e;
padding: .5em;
width: 90%;
border-radius: 4em;
box-sizing: border-box;
margin: 5px 5px;
}
}
/*霑ｽ蜉�縲縺薙％縺九ｉ*/
#top .top_inner_img {
width: 50%;
margin-left: 25%;
margin-top: 10%;
margin-bottom: 3rem;
}
/*#top .button {
width: 70%;
margin-left: 15%;
}*/
#top .top_inner_band {
font-size: 3.5em;
font-weight: 600;
line-height: 1.0;
margin-bottom: .5em;
text-align: center;
padding: 2rem 0;
color: #ffffff;
background-color: #151c51;
letter-spacing: .25rem;
}
#top .top_inner_band > a {
color: #ffffff;
}
#top .top_inner_band > a:hover {
color: #ffff00;
}
#top .top_inner_band small {
font-size: .8em;
font-weight: 600;
}
@media screen and (max-width: 1280px) {
#top .top_inner_band {
font-size: 2em;
}
}
@media screen and (max-width: 750px) {
#top .top_inner_band {
font-size:1.5em;
}
}
/*霑ｽ蜉�縲縺薙％縺ｾ縺ｧ*/
#top h2 {
margin: 30px auto 45px;
max-width: 250px;
}
#top h2 img {
width: 100%
}
#resolvable, #resolvable2, #resolvable3, #resolvable4 {
padding: 0 0
}
#resolvable3 .resolvable_inner .contents_body .question_block, #resolvable4 .resolvable_inner .contents_body .question_block {
padding: 100px 0 0;
position: relative
}
#resolvable3 .resolvable_inner .contents_body .question_block h2, #resolvable4 .resolvable_inner .contents_body .question_block h2 {
margin-bottom: 60px
}
#resolvable3 .resolvable_inner .contents_body .question_block h2 span.q {
background: url(../../com/img/q.png) 100%/100% no-repeat;
display: inline-block;
text-indent: -9999px;
vertical-align: middle;
margin-right: .5em;
width: 55px;
height: 60px;
overflow: hidden
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner, #resolvable4 .resolvable_inner .contents_body .question_block .q_b_inner {
display: flex;
align-items: flex-end;
justify-content: space-between;
flex-wrap: wrap;
margin: 0 auto;
margin-bottom: 280px;
max-width: 1080px;
width: 100%
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q_container, #resolvable4 .resolvable_inner .contents_body .question_block .q_b_inner .q_container {
position: relative;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
background-color: #f1f1f1;
width: calc(33.33% - 30px);
height: 200px;
font-size: 1.25em;
font-weight: 500;
line-height: 1.75;
color: #151c51;
border-radius: 40px 10px 40px 10px;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q_container::before {
content: '';
width: 45px;
height: 35px;
/* background: url(../../com/img/double_quotes.png) center/contain no-repeat;*/
position: absolute;
top: -10px;
left: 0;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container, #resolvable4 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container {
position: relative;
justify-content: center;
align-items: center;
text-align: center;
background-color: #f1f1f1;
width: calc(33.33% - 30px);
height: 350px;
font-size: 1.25em;
font-weight: 500;
line-height: 1;
color: #224C6E;
border-radius: 40px 10px 40px 10px;
padding: 20px 20px 50px 20px;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container::before {
content: '';
width: 45px;
height: 35px;
/*background: url(../../com/img/double_quotes.png) center/contain no-repeat;*/
position: absolute;
top: -10px;
left: 0;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p, #resolvable4 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p {
display: block;
margin-bottom: 0.5em;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p.reason_title, #resolvable4 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p.reason_title {
font-size: 1.6em;
letter-spacing: 0.2em;
font-weight: 600;
margin-bottom: 0.5em;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p.reason_txt, #resolvable4 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p.reason_txt {
font-size: 0.8em;
font-weight: normal;
margin-top: 1em;
text-align: left;
border-top: 1px solid #151c51;
padding-top: 0.75em;
line-height: 1.5em;
color: #212529;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p.reason_txt_s, #resolvable4 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p.reason_txt_s {
font-size: 0.6em;
font-weight: normal;
text-align: left;
padding-top: 0.5em;
line-height: 1.5em;
color: #212529;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q_container.q_01::after {
content: '';
width: 300px;
height: 225px;
background: url(../../com/img/case01.png) center/contain no-repeat;
transform: translateY(-50%) translateX(-50%);
position: absolute;
bottom: -300px;
left: 50%;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q_container.q_02::after {
content: '';
width: 300px;
height: 225px;
background: url(../../com/img/case02.png) center/contain no-repeat;
transform: translateY(-50%) translateX(-50%);
position: absolute;
bottom: -300px;
left: 50%;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q_container.q_03::after {
content: '';
width: 300px;
height: 225px;
background: url(../../com/img/case03.png) center/contain no-repeat;
transform: translateY(-50%) translateX(-50%);
position: absolute;
bottom: -300px;
left: 50%;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container.q_01-2::after {
content: '';
width: 300px;
height: 225px;
background: url(../../com/img/point01.png) center/contain no-repeat;
transform: translateY(-50%) translateX(-50%);
position: absolute;
bottom: -300px;
left: 50%;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container.q_02-2::after {
content: '';
width: 300px;
height: 225px;
background: url(../../com/img/point02.png) center/contain no-repeat;
transform: translateY(-50%) translateX(-50%);
position: absolute;
bottom: -300px;
left: 50%;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container.q_03-2::after {
content: '';
width: 300px;
height: 225px;
background: url(../../com/img/point03.png) center/contain no-repeat;
transform: translateY(-50%) translateX(-50%);
position: absolute;
bottom: -300px;
left: 50%;
}
#resolvable3 .resolvable_inner .contents_body .question_block::after {
content: "";
border-left: 120px solid transparent;
border-right: 120px solid transparent;
border-top: 60px solid #fff;
display: block;
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%)
}
@media screen and (max-width: 1060px) {
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner {
padding: 0 20px;
width: auto;
margin-bottom: 220px;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q_container {
width: calc(33.33% - 20px);
height: 150px;
font-size: 1em;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q_container::before {
width: 40px;
height: 31px;
top: -5px;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container.q_01::after, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container.q_01-2::after {
width: 250px;
height: 150px;
bottom: -200px;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q_container.q_02::after, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container.q_02-2::after {
width: 250px;
height: 150px;
bottom: -200px;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q_container.q_03::after, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container.q_03-2::after {
width: 250px;
height: 150px;
bottom: -200px;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container {
width: calc(33.33% - 20px);
height: 300px;
font-size: 1em;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container::before {
width: 40px;
height: 31px;
top: -5px;
}
}
@media screen and (max-width: 750px) {
#resolvable3 .resolvable_inner .contents_body .question_block, #resolvable4 .resolvable_inner .contents_body .question_block {
padding: 80px 0 0;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner, #resolvable4 .resolvable_inner .contents_body .question_block .q_b_inner {
margin-bottom: 0;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q_container, #resolvable4 .resolvable_inner .contents_body .question_block .q_b_inner .q_container {
width: 100%;
margin: 0 auto 180px;
font-size: 1.1em;
height: 180px;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container, #resolvable4 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container {
width: 100%;
margin: 0 auto 180px;
font-size: 1.1em;
height: 260px;
}
#resolvable3 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p.reason_txt, #resolvable4 .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p.reason_txt {
font-size: 0.8em;
}
}
#resolvable3 .resolvable_inner .contents_body .answer_block, #resolvable4 .resolvable_inner .contents_body .answer_block {
padding: 170px 0 100px;
background-color: #5C83A3;
}
#resolvable2 .resolvable_inner .contents_body .answer_block {
padding: 170px 0 100px;
background-color: #5C83A3;
}
#resolvable3 .resolvable_inner .contents_body .answer_block h2, #resolvable2 .resolvable_inner .contents_body .answer_block h2, #resolvable4 .resolvable_inner .contents_body .answer_block h2 {
color: #fff;
font-size: 4em;
margin-bottom: 0;
}
#resolvable3 .resolvable_inner .contents_body .answer_block h2 small, #resolvable2 .resolvable_inner .contents_body .answer_block h2 small, #resolvable4 .resolvable_inner .contents_body .answer_block h2 small {
font-size: .7em;
font-weight: 900;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .sub_title, #resolvable4 .resolvable_inner .contents_body .answer_block .sub_title {
color: #fff;
font-size: 2em;
font-weight: 600;
text-align: center;
margin-bottom: 1em;
}
#resolvable2 .resolvable_inner .contents_body .answer_block .sub_title {
color: #fff;
font-size: 3em;
font-weight: 600;
text-align: center;
margin-bottom: 1em;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison {
position: relative;
display: flex;
justify-content: space-between;
align-items: flex-end;
max-width: 1080px;
margin: 0 auto 3em;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_container, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_container {
width: calc(50% - 80px);
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_container p, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container p, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_container p {
text-align: center;
font-size: 1.25em;
font-weight: 600;
color: #fff;
margin-bottom: 10px;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_container p small, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container p small, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_container p small {
margin-left: 5px;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_container figure, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container figure, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_container figure {
margin: 0;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_container figure img, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container figure img, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_container figure img {
max-width: 100%;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_arrow, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_arrow {
position: absolute;
width: 195px;
transform: translateY(-50%) translateX(-50%);
top: 50%;
left: 50%;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_arrow p, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow p, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_arrow p {
font-size: 2.5em;
font-weight: 600;
color: #fff;
text-align: center;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_arrow figure, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow figure, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_arrow figure {
margin: 0;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_arrow figure img, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow figure img, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_arrow figure img {
max-width: 100%;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .merit_heading, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .merit_heading, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .merit_heading {
display: block;
width: 470px;
margin: 5em auto 2em;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .merit_heading img, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .merit_heading img, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .merit_heading img {
max-width: 100%;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block {
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
max-width: 1080px;
margin: 1em auto;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box {
width: 336px;
height: 377px;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box.merit01, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box.merit01 {
background: url(../../com/img/merit_container01.png) center/contain no-repeat;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box.merit02, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box.merit02 {
background: url(../../com/img/merit_container02.png) center/contain no-repeat;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box.merit03, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box.merit03 {
background: url(../../com/img/merit_container03.png) center/contain no-repeat;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner {
width: 320px;
height: 346px;
transform: translateY(4.2%) translateX(.2%);
padding: 1.5em;
box-sizing: border-box;
text-align: center;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img {
width: auto;
height: 94px;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title {
font-size: 1.4em;
font-weight: 600;
color: #00539b;
margin: 10px 0;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail {
font-size: 1em;
text-align: justify;
/* color: #00539b;*/
margin: 15px 0 0;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .benefit, #resolvable2 .resolvable_inner .contents_body .answer_block .benefit, #resolvable4 .resolvable_inner .contents_body .answer_block .benefit {
font-size: 2em;
font-weight: 600;
text-align: center;
color: #fff;
background-color: #5C83A3;
padding: 1em;
margin: 2em auto;
border-radius: 10px 40px 10px 40px;
max-width: 1080px;
box-sizing: border-box;
}
@media screen and (max-width: 1060px) {
#resolvable3 .resolvable_inner .contents_body .answer_block, #resolvable2 .resolvable_inner .contents_body .answer_block, #resolvable4 .resolvable_inner .contents_body .answer_block {
padding: 150px 20px 100px;
width: auto
}
#resolvable3 .resolvable_inner .contents_body .answer_block h2, #resolvable2 .resolvable_inner .contents_body .answer_block h2, #resolvable4 .resolvable_inner .contents_body .answer_block h2 {
font-size: 3.5em;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .sub_title, #resolvable2 .resolvable_inner .contents_body .answer_block .sub_title, #resolvable4 .resolvable_inner .contents_body .answer_block .sub_title {
font-size: 1.5em;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_container p, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container p, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_container p {
font-size: 1em;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_container, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_container {
width: calc(50% - 60px);
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_arrow, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_arrow {
width: 160px;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_arrow p, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow p, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_arrow p {
font-size: 2em;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box {
width: 230px;
height: 258px;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner {
width: 219px;
height: 237px;
padding: 1em;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title {
font-size: 1em;
margin: 5px 0;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img {
height: 70px;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail {
font-size: .6em;
margin: 5px 0 0;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .benefit, #resolvable2 .resolvable_inner .contents_body .answer_block .benefit, #resolvable4 .resolvable_inner .contents_body .answer_block .benefit {
font-size: 1.5em;
margin: 2em auto 1em;
}
}
@media screen and (min-width: 780px) and (max-width: 1060px) {
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block {
justify-content: center;
}
}
@media screen and (max-width: 750px) {
#resolvable3 .resolvable_inner .contents_body .answer_block, #resolvable2 .resolvable_inner .contents_body .answer_block, #resolvable4 .resolvable_inner .contents_body .answer_block {
padding: 100px 20px 100px;
}
#resolvable3 .resolvable_inner .contents_body .answer_block h2, #resolvable2 .resolvable_inner .contents_body .answer_block h2, #resolvable4 .resolvable_inner .contents_body .answer_block h2 {
font-size: 1.8em;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .sub_title, #resolvable4 .resolvable_inner .contents_body .answer_block .sub_title {
font-size: 1em;
margin-bottom: 3em;
}
#resolvable2 .resolvable_inner .contents_body .answer_block .sub_title {
font-size: 1.3em;
margin-bottom: 2em;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison {
flex-wrap: wrap;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_container, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_container {
width: 100%;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_arrow, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_arrow {
width: auto;
height: 140px;
position: inherit;
transform: inherit;
margin: auto;
top: auto;
left: auto;
display: flex;
align-items: center;
justify-content: center;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .comparison_arrow figure, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow figure, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_arrow figure {
transform: rotate(90deg);
width: 100px;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .merit_heading, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .merit_heading, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .merit_heading {
width: 100%;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block {
flex-wrap: wrap;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box {
width: 336px;
height: 377px;
margin: 0 auto 3em;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner {
width: 320px;
height: 346px;
padding: 1.5em;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title {
font-size: 1.4em;
margin: 10px 0;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img {
height: 94px;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail {
font-size: .9em;
margin: 10px 0 0;
}
#resolvable3 .resolvable_inner .contents_body .answer_block .benefit, #resolvable2 .resolvable_inner .contents_body .answer_block .benefit, #resolvable4 .resolvable_inner .contents_body .answer_block .benefit {
font-size: 1.4em;
margin: 0 auto 1em;
border-radius: 5px 20px 5px 20px;
text-align: justify;
}
}
#relief {
background: url(../../com/img/relief_bg.jpg) center bottom/cover no-repeat;
}
#relief-2 {
background: url(../../com/img/relief_bg4.jpg) center bottom/cover no-repeat;
}
#relief .relief_inner, #relief-2 .relief_inner {
max-width: 1280px;
width: 100%;
margin: 0 auto;
}
#relief .relief_inner .contents_body h2 {
margin-bottom: 0;
}
#relief .relief_inner .contents_body h2 small {
display: block;
font-size: .8em;
margin-top: 10px;
}
#relief .relief_inner .contents_body .reason .contents_block, #relief-2 .relief_inner .contents_body .reason .contents_block {
position: relative;
height: 600px;
-webkit-transform: translateY(-10%);
transform: translateY(-10%);
}
#relief .relief_inner .contents_body .reason .contents_block .r_box {
border-radius: 100%;
background: #fff;
-webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
width: 420px;
height: 420px;
position: absolute;
transition: all 0.1s ease-out;
padding: 1.5em;
box-sizing: border-box;
text-align: center;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box:nth-of-type(1) {
top: 20px;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box:nth-of-type(2) {
bottom: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
#relief .relief_inner .contents_body .reason .contents_block .r_box:last-of-type {
top: 20px;
right: 0;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box .r_b_inner img {
width: 70px;
height: 70px;
margin-bottom: 5px;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box .r_b_inner .sub_heading {
font-weight: 600;
color: #151c51;
margin-bottom: 10px;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box .r_b_inner .heading {
font-size: 1.5em;
font-weight: 600;
color: #439b89;
margin-bottom: 10px;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box .r_b_inner .detail {
font-size: .85em;
line-height: 1.75;
color: #151c51;
text-align: justify;
margin: 0 auto;
max-width: 300px;
}
#relief-2 .relief_inner .movie {
position: relative;
padding-top: 56.25%;
}
#relief-2 .relief_inner .movie iframe {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
width: 100%;
height: 100%;
max-width: 1000px;
max-height: 562.5px;
}
@media screen and (max-width: 1080px) {
#relief .relief_inner .contents_body .reason .contents_block .r_box {
width: 360px;
height: 360px;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box .r_b_inner img {
width: 60px;
height: 60px;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box .r_b_inner .sub_heading {
font-size: .8em;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box .r_b_inner .heading {
font-size: 1.2em;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box .r_b_inner .detail {
line-height: 1.75;
font-size: .75em;
max-width: 260px;
}
}
@media screen and (max-width: 980px) {
#relief .relief_inner .contents_body .reason .contents_block, #relief-2 .relief_inner .contents_body .reason .contents_block {
height: 700px;
transform: inherit;
}
}
@media screen and (max-width: 750px) {
#relief .relief_inner .contents_body .reason .contents_block, #relief-2 .relief_inner .contents_body .reason .contents_block {
height: auto;
margin-top: 3em;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box {
width: 335px;
height: 335px;
padding: 1em;
position: inherit;
margin: 0 auto 2em;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box .r_b_inner img {
width: 50px;
height: 50px;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box .r_b_inner .detail {
font-size: .7em;
max-width: 240px;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box:nth-of-type(1) {
top: 0;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box:nth-of-type(2) {
left: 0;
transform: inherit;
}
#relief .relief_inner .contents_body .reason .contents_block .r_box:last-of-type {
top: 0;
margin-bottom: 0;
}
#relief-2 .relief_inner .movie {
position: relative;
padding-top: 56.25%;
margin-bottom: 3em;
}
}
#feature {
background-color: #E3E9EB;
}
#feature .feature_inner h2 small {
display: block;
font-size: .65em;
margin-top: 10px;
}
#feature .feature_inner .contents_body .sbs {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 5em;
}
#feature .feature_inner .contents_body .sbs .sbs_txt {
width: calc(100% - 500px);
}
#feature .feature_inner .contents_body .sbs .sbs_txt img {
width: 70px;
height: 70px;
margin-bottom: 1em;
}
#feature .feature_inner .contents_body .sbs .sbs_txt .feature_heading, #feature .feature_inner .contents_body .sbs .sbs_txt .feature_heading2 {
font-size: 1.5em;
font-weight: 600;
color: #224C6E;
margin-bottom: .5em;
}
#feature .sbs-first .feature_heading, #feature .sbs-first .feature_heading2 {
font-size: 1.5em;
font-weight: 600;
color: #151c51;
margin-bottom: .5em;
text-align: center;
}
#feature .feature_inner .contents_body .sbs .sbs_txt p, #feature .sbs-first p {
/* color: #151c51;*/
text-align: justify;
line-height: 1.75;
}
#feature .feature_inner .contents_body .sbs .sbs_txt .feature_em {
font-size: 1.5em;
font-weight: 600;
color: #00539b;
margin-top: .75em;
}
#feature .sbs-first h3 {
font-size: 2em;
font-weight: 600;
color: #316464;
margin: .5em;
display: block;
}
#feature .sbs-first img {
-webkit-tap-highlight-color: transparent;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
height: auto;
display: inline-block;
max-width: 100%;
width: auto;
height: auto;
}
#feature .feature_inner .contents_body .sbs .sbs_img {
width: 460px;
margin-bottom: 8em;
}
#feature .feature_inner .contents_body .sbs .sbs_img:last-child {
margin-bottom: 4em;
}
#feature .feature_inner .contents_body .sbs .sbs_img img {
max-width: 100%;
border-radius: 20px;
}
#feature .feature_inner .contents_body .sbs .order01, #feature .feature_inner .contents_body .sbs .order01-2, #feature .feature_inner .contents_body .sbs .order01-3 {
order: 1;
position: relative;
}
#feature .feature_inner .contents_body .sbs .order01::after {
position: absolute;
content: '';
background: url(../../com/img/feature_illust01.png) center/contain no-repeat;
width: 268px;
height: 268px;
left: -30%;
bottom: -30%;
}
#feature .feature_inner .contents_body .sbs .order01-2::after {
position: absolute;
content: '';
background: url(../../com/img/feature_illust03.png) center/contain no-repeat;
width: 268px;
height: 268px;
left: -30%;
bottom: -30%;
}
#feature .feature_inner .contents_body .sbs .order01-3::after {
position: absolute;
content: '';
background: url(../../com/img/feature_illust_keihi.png) center/contain no-repeat;
width: 268px;
height: 268px;
left: -30%;
bottom: -30%;
}
#feature .feature_inner .contents_body .sbs .order02 {
order: 2;
}
#feature .feature_inner .contents_body .sbs .order03 {
order: 3;
}
#feature .feature_inner .contents_body .sbs .order04, #feature .feature_inner .contents_body .sbs .order04-2 {
order: 4;
position: relative;
}
#feature .feature_inner .contents_body .sbs .order04::after {
position: absolute;
content: '';
background: url(../../com/img/feature_illust02.png) center/contain no-repeat;
width: 241px;
height: 327px;
right: -30%;
bottom: -45%;
}
#feature .feature_inner .contents_body .sbs .order04-2::after {
position: absolute;
content: '';
background: url(../../com/img/feature_illust03.png) center/contain no-repeat;
width: 199px;
height: 270px;
right: -30%;
bottom: -45%;
}
#feature .feature_inner .contents_body .sbs .order05, #feature .feature_inner .contents_body .sbs .order05-2, #feature .feature_inner .contents_body .sbs .order05-3 {
order: 5;
position: relative;
}
#feature .feature_inner .contents_body .sbs .order05::after {
position: absolute;
content: '';
background: url(../../com/img/feature_illust03.png) center/contain no-repeat;
width: 239px;
height: 354px;
left: -30%;
bottom: -45%;
}
#feature .feature_inner .contents_body .sbs .order05-2::after {
position: absolute;
content: '';
background: url(../../com/img/feature_illust_nagano.png) center/contain no-repeat;
width: 182px;
height: 270px;
left: -30%;
bottom: -45%;
}
#feature .feature_inner .contents_body .sbs .order05-3::after {
position: absolute;
content: '';
background: url(../../com/img/feature_illust04.png) center/contain no-repeat;
width: 239px;
height: 354px;
left: -30%;
bottom: -45%;
}
#feature .feature_inner .contents_body .sbs .order06 {
order: 6;
}
#feature .feature_inner .contents_body .sbs .order07 {
order: 7;
}
#feature .feature_inner .contents_body .sbs .order08 {
order: 8;
}
#feature .feature_inner .contents_body .sbs .order08::after {
position: absolute;
content: '';
background: url(../../com/img/miyagi/feature_illust_miyagi.png) center/contain no-repeat;
width: 200px;
height: 200px;
right: -25%;
bottom: -30%;
}
#feature .feature_inner .contents_body .sbs .order08 {
order: 8;
position: relative;
}
#feature .feature_inner .contents_body .sbs .order01-3::after {
position: absolute;
content: '';
background: url(../../com/img/feature_illust_keihi.png) center/contain no-repeat;
width: 199px;
height: 270px;
right: -30%;
bottom: -45%;
}
#feature .feature_inner .contents_body .sbs .order05-2::after {
position: absolute;
content: '';
background: url(../../com/img/feature_illust02.png) center/contain no-repeat;
width: 199px;
height: 270px;
right: -30%;
bottom: -45%;
}
@media screen and (max-width: 1060px) {
#feature .feature_inner .contents_body .sbs .sbs_img {
width: 300px;
}
#feature .feature_inner .contents_body .sbs .sbs_txt {
width: calc(100% - 340px);
}
#feature .feature_inner .contents_body .sbs .order01::after {
width: 150px;
height: 150px;
left: 0;
bottom: -50%;
}
#feature .feature_inner .contents_body .sbs .order04::after {
width: 150px;
height: 204px;
right: 0;
bottom: -70%;
}
#feature .feature_inner .contents_body .sbs .order05::after {
width: 150px;
height: 222px;
left: 0;
bottom: -60%;
}
#feature .feature_inner .contents_body .sbs .sbs_txt img {
width: 50px;
height: 50px;
margin-bottom: .5em;
}
#feature .feature_inner .contents_body .sbs .sbs_txt .feature_heading, #feature .sbs-first .feature_heading, #feature .feature_inner .contents_body .sbs .sbs_txt .feature_heading2, #feature .sbs-first .feature_heading2 {
font-size: 1.25em;
}
#feature .feature_inner .contents_body .sbs .sbs_txt .feature_em{
font-size: .9em;
text-align: center;
}
#feature .sbs-first h3 {
font-size: 1.5em;
}
#feature .feature_inner .contents_body .sbs .sbs_txt p, #feature .sbs-first p {
font-size: .9em;
}
}
@media screen and (max-width: 750px) {
#feature .feature_inner .contents_body .sbs {
margin-top: 3em;
}
#feature .feature_inner .contents_body .sbs .sbs_txt {
width: 100%;
margin-bottom: 1em;
}
#feature .feature_inner .contents_body .sbs .sbs_img {
width: 100%;
}
#feature .feature_inner .contents_body .sbs .sbs_txt .feature_heading, #feature .sbs-first .feature_heading {
font-size: 1em;
text-align: left;
}
#feature .feature_inner .contents_body .sbs .sbs_txt .feature_heading2, #feature .sbs-first .feature_heading2 {
font-size: 1.15em;
text-align: center;
margin-top: 3em;
}
#feature .feature_inner .contents_body .sbs .order01, #feature .feature_inner .contents_body .sbs .order02, #feature .feature_inner .contents_body .sbs .order03, #feature .feature_inner .contents_body .sbs .order04, #feature .feature_inner .contents_body .sbs .order05, #feature .feature_inner .contents_body .sbs .order06, #feature .feature_inner .contents_body .sbs .order01-2, #feature .feature_inner .contents_body .sbs .order01-3, #feature .feature_inner .contents_body .sbs .order04-2, #feature .feature_inner .contents_body .sbs .order05-2, #feature .feature_inner .contents_body .sbs .order05-3 {
order: inherit;
}
#feature .feature_inner .contents_body .sbs .order01::after {
left: inherit;
bottom: -30%;
right: 0;
}
#feature .feature_inner .contents_body .sbs .order04::after {
bottom: -40%;
}
#feature .feature_inner .contents_body .sbs .order05::after {
left: inherit;
bottom: -50%;
right: 0;
}
#feature .feature_inner .contents_body .sbs .order01-2::after {
left: inherit;
bottom: -50%;
right: -15%;
}
#feature .feature_inner .contents_body .sbs .order01-3::after {
left: inherit;
bottom: -50%;
right: -10%;
}
#feature .feature_inner .contents_body .sbs .order04-2::after {
bottom: -40%;
right: -10%;
height: 80%;
}
#feature .feature_inner .contents_body .sbs .order05-2::after {
left: inherit;
bottom: -45%;
right: -5%;
height: 80%;
}
#feature .feature_inner .contents_body .sbs .order05-3::after {
left: inherit;
bottom: -45%;
right: -5%;
height: 80%;
}
#feature .feature_inner .contents_body .sbs .order08::after {
left: inherit;
bottom: -45%;
right: -5%;
height: 80%;
}
#feature .feature_inner .contents_body .sbs .sbs_img {
margin-bottom: 4em;
}
}
#flow .flow_inner {
width: 100%;
max-width: 1080px;
margin: 0 auto;
}
#flow .flow_inner .contents_body .steps {
display: flex;
justify-content: space-between;
align-items: flex-start;
}
#flow .flow_inner .contents_body .steps .step_next {
width: calc(25% - 10px);
height: 262px;
background: url(../../com/img/step_next.png) center/contain no-repeat;
}
#flow .flow_inner .contents_body .steps .step_next .step_next_inner {
color: #fff;
padding: 1em 2em 1em 1em;
box-sizing: border-box;
height: 262px;
}
#flow .flow_inner .contents_body .steps .step_next .step_next_inner .step_num {
font-family: futura-pt, sans-serif;
font-size: 1.2em;
font-weight: 600;
text-align: center;
margin-top: 10px;
margin-bottom: 10px;
}
#flow .flow_inner .contents_body .steps .step_next .step_next_inner .step_title {
font-size: 1.2em;
font-weight: 600;
text-align: center;
margin-bottom: 10px;
}
#flow .flow_inner .contents_body .steps .step_next .step_next_inner p {
font-size: .8em;
line-height: 1.75;
text-align: justify;
}
#flow .flow_inner .contents_body .steps .step_end {
width: calc(25% - 10px);
height: 262px;
background: url(../../com/img/step_end.png) center/contain no-repeat;
}
#flow .flow_inner .contents_body .steps .step_end .step_end_inner {
color: #fff;
padding: 1em 1.5em;
box-sizing: border-box;
}
#flow .flow_inner .contents_body .steps .step_end .step_end_inner .step_num {
font-family: futura-pt, sans-serif;
font-size: 1.2em;
font-weight: 600;
text-align: center;
margin-top: 10px;
margin-bottom: 10px;
}
#flow .flow_inner .contents_body .steps .step_end .step_end_inner .step_title {
font-size: 1.2em;
font-weight: 600;
text-align: center;
margin-bottom: 10px;
}
#flow .flow_inner .contents_body .steps .step_end .step_end_inner p {
font-size: .8em;
line-height: 2.0;
text-align: justify;
}
@media screen and (max-width: 1060px) {
#flow .flow_inner .contents_body .steps .step_next {
height: 174px;
width: 171px;
}
#flow .flow_inner .contents_body .steps .step_next .step_next_inner .step_num {
font-size: 1em;
margin-top: 0;
margin-bottom: 5px;
}
#flow .flow_inner .contents_body .steps .step_next .step_next_inner .step_title {
font-size: .9em;
margin-bottom: 5px;
}
#flow .flow_inner .contents_body .steps .step_next .step_next_inner {
color: #fff;
padding: .5em 1em .5em .5em;
box-sizing: border-box;
height: 174px;
}
#flow .flow_inner .contents_body .steps .step_next .step_next_inner p {
font-size: .65em;
line-height: 1.5;
}
#flow .flow_inner .contents_body .steps .step_end {
height: 174px;
width: 171px;
}
#flow .flow_inner .contents_body .steps .step_end .step_end_inner .step_num {
font-size: 1em;
margin-top: 0;
margin-bottom: 5px;
}
#flow .flow_inner .contents_body .steps .step_end .step_end_inner .step_title {
font-size: .9em;
margin-bottom: 5px;
}
#flow .flow_inner .contents_body .steps .step_end .step_end_inner {
color: #fff;
padding: .5em 1em;
box-sizing: border-box;
}
#flow .flow_inner .contents_body .steps .step_end .step_end_inner p {
font-size: .65em;
line-height: 1.5;
text-align: justify;
}
}
@media screen and (min-width: 780px) and (max-width: 1060px) {
#flow .flow_inner .contents_body .steps {
justify-content: center;
}
}
@media screen and (max-width: 750px) {
#flow .flow_inner .contents_body .steps {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
}
#flow .flow_inner .contents_body .steps .step_next {
width: 100%;
height: auto;
background: #00539b;
margin-bottom: 2em;
border-radius: 10px;
}
#flow .flow_inner .contents_body .steps .step_next .step_next_inner {
color: #fff;
padding: 1em;
box-sizing: border-box;
height: auto;
position: relative;
}
#flow .flow_inner .contents_body .steps .step_next .step_next_inner::after {
content: "";
border-left: 80px solid transparent;
border-right: 80px solid transparent;
border-top: 40px solid #00539b;
display: block;
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
#flow .flow_inner .contents_body .steps .step_next .step_next_inner p {
font-size: .75em;
}
#flow .flow_inner .contents_body .steps .step_next .step_next_inner .step_title {
font-size: 1.2em;
}
#flow .flow_inner .contents_body .steps .step_end {
height: auto;
width: 100%;
background: #00539b;
border-radius: 10px;
}
#flow .flow_inner .contents_body .steps .step_end .step_end_inner {
padding: 1em;
}
#flow .flow_inner .contents_body .steps .step_end .step_end_inner .step_title {
font-size: 1.2em;
}
#flow .flow_inner .contents_body .steps .step_end .step_end_inner p {
font-size: .75em;
}
}
#form {
background-color: #5C83A3;
}
#form .form_inner .contents_body h2 {
color: #fff;
margin-bottom: 1em;
}
#form .form_inner .contents_body .form_desc {
color: #fff;
font-size: 1em;
text-align: center;
margin-bottom: 3em;
}
#form .form_inner .contents_body .bg_white {
background-color: #fff;
border-radius: 20px;
padding: 3em 3em 5em;
box-sizing: border-box;
}
#form .form_inner .contents_body .label_required {
font-size: .8em;
font-weight: 500;
color: #fff;
background-color: #00539b;
display: inline-block;
padding: .25em .5em !important;
margin-left: 1em;
}
#form .form_inner .contents_body .input_area {
margin-bottom: 50px
}
#form .form_inner .contents_body .input_area h2 {
padding-bottom: 30px;
margin-bottom: 20px
}
#form .form_inner .contents_body .input_area table {
border-spacing: 0 30px;
margin: 0 auto;
max-width: 796px;
width: 100%
}
#form .form_inner .contents_body .input_area table tr th {
font-weight: normal;
padding-top: 10px;
padding-right: 30px;
text-align: right;
vertical-align: top;
width: 30%;
}
#form .form_inner .contents_body .input_area table tr td {
color: #939393;
position: relative
}
#form .form_inner .contents_body .input_area table tr td input, #form .form_inner .contents_body .input_area table tr td textarea {
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 100%
}
#form .form_inner .contents_body .input_area table tr td input[name="postalcode"] {
width: 140px
}
#form .form_inner .contents_body .input_area table tr td textarea {
height: 200px
}
#form .form_inner .contents_body .input_area table tr:last-of-type {
margin-bottom: 0
}
#form .form_inner .contents_body .privacy_area {
margin: 20px 0
}
#form .form_inner .contents_body .privacy_area a {
font-size: .8em;
}
#form .form_inner .contents_body .agree {
margin-bottom: 80px;
text-align: center
}
#form .form_inner .contents_body .agree span {
padding-left: 15px
}
#form .form_inner .contents_body .freephone_container {
padding: 1em 5px;
border: 2px solid #fff;
border-radius: 20px;
box-sizing: border-box;
margin-top: 3em;
}
#form .form_inner .contents_body .freephone_container .freephone_title {
color: #fff;
font-size: 1.4em;
font-weight: 600;
text-align: center;
margin: 20px 0;
}
#form .form_inner .contents_body .freephone_container .freephone_number {
font-family: futura-pt, sans-serif;
color: #fff;
font-size: 2.4em;
font-weight: 600;
text-align: center;
margin-bottom: 20px;
white-space: nowrap;
}
#form .form_inner .contents_body .freephone_container .freephone_number span {
position: relative;
color: #fff;
padding-left: 80px;
}
#form .form_inner .contents_body .freephone_container .freephone_number span::before {
position: absolute;
display: block;
content: '';
background: url(../../com/img/freedial.png) center/contain no-repeat;
width: 70px;
height: 40px;
top: 50%;
left: 0;
transform: translateY(-50%);
}
#form .form_inner .contents_body .freephone_container .freephone_address {
color: #fff;
font-size: .9em;
font-weight: 500;
text-align: center;
margin-bottom: 20px;
}
#form .contact-form dl.form-group dd input {
color: #6A6A6A;
position: relative
}
@media screen and (max-width: 750px) {
#form .form_inner .contents_body .input_area table tr th, .contact-form dl.form-group dt {
display: block;
text-align: left;
font-size: .8em;
margin-bottom: 5px;
}
#form .form_inner .contents_body .input_area table tr td, .contact-form dl.form-group dd {
display: block
}
#form .form_inner .contents_body .input_area table tr td input[name="postalcode"] {
width: calc(50% - 20px)
}
#form .form_inner .contents_body .bg_white {
padding: 1em 1em 3em;
}
#form .form_inner .contents_body .agree {
text-align: left;
}
#form .form_inner .contents_body .agree span {
padding-left: 10px;
font-size: .9em;
}
#form .form_inner .contents_body .freephone_container .freephone_number {
font-size: 1.6em;
}
#form .form_inner .contents_body .freephone_container .freephone_number span {
padding-left: 60px;
}
#form .form_inner .contents_body .freephone_container .freephone_number span::before {
width: 50px;
height: 29px;
}
#form .form_inner .contents_body .form_desc {
font-size: 0.9em;
text-align: left;
line-height: 1.5em;
}
}
#footer {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
background: #00539b;
margin: 0 auto;
padding: 30px;
width: 100%;
text-align: center;
box-sizing: border-box;
}
#footer .copyright {
color: #fff;
}
#footer .copyright small {
font-size: 14px;
font-size: 1.4rem
}
#go_top {
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
position: fixed;
width: 50px;
height: 50px;
bottom: -100px;
right: 20px;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out
}
#go_top a {
background: #151c51;
display: block;
width: 100%;
height: 100%;
position: relative
}
#go_top a span {
font-size: 10px;
font-size: 1rem;
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
color: #fff;
display: block;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%) rotate(45deg);
transform: translate(-50%, -50%) rotate(45deg)
}
#go_top a span svg {
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg)
}
#go_top a span svg .arrow {
fill: #fff
}
#go_top a.hover:hover {
background: #5E6492
}
#go_top.on {
bottom: 20px
}
.scrollEvent {
opacity: 0;
-webkit-transition: all 1s ease-in-out;
transition: all 1s ease-in-out
}
.scrollEvent.effect {
opacity: 1 !important
}
#case .posts {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#case .posts article {
width: 30%;
margin-bottom: 4em;
}
#case .posts article h5 {
font-size: 1em;
font-weight: normal;
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
margin: 0 0 1em;
padding: 5px 1px 3px 5px;
border-bottom: 2px solid #991d1d;
}
#case .posts article h3.h3-catch {
color: #9f263d;
text-align: left;
margin-bottom: 1em;
}
#case .posts article .button {
-moz-appearance: none;
-webkit-appearance: none;
-ms-appearance: none;
appearance: none;
-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
background-color: transparent;
border-radius: 0.375em;
border: 0;
box-shadow: inset 0 0 0 2px #9f263d;
color: #9f263d;
cursor: pointer;
display: inline-block;
font-size: 0.8em;
font-weight: 600;
height: 3.5em;
letter-spacing: 0.075em;
line-height: 3.5em;
padding: 0 2.25em;
text-align: center;
text-decoration: none;
white-space: nowrap;
}
#case .posts article .button:hover {
background-color: rgba(245, 106, 106, 0.25);
}
#case .posts article .image {
display: block;
margin-bottom: .5em;
overflow: hidden;
box-sizing: border-box;
border: 1px solid #bbb;
}
#case .posts article .image img {
display: block;
width: 100%;
max-width: 100%;
-moz-transition: -moz-transform 0.2s ease;
-webkit-transition: -webkit-transform 0.2s ease;
-ms-transition: -ms-transform 0.2s ease;
transition: transform 0.2s ease;
}
#case .posts article a.image:hover img {
-moz-transform: scale(1.075);
-webkit-transform: scale(1.075);
-ms-transform: scale(1.075);
transform: scale(1.075);
}
@media screen and (max-width: 1060px) {
#case .posts article {
width: 48%;
}
}
@media screen and (max-width: 750px) {
#case .posts article {
width: 100%;
}
}
#assistance .assistance_text {
width: 50%;
margin-bottom: 1em;
padding-right: 2.5em;
text-align: justify;
box-sizing: border-box;
}
#assistance .assistance_img {
width: 50%;
text-align: center;
}
#assistance .assistance_img img {
width: 100%;
}
@media screen and (max-width: 750px) {
#assistance .assistance_text {
width: 100%;
padding-right: 0;
}
#assistance .assistance_img {
width: 100%;
}
}
/*==================
#loading
==================*/
#loading {
position: fixed;
top: 0;
left: 0;
bottom: 0;
z-index: 99999;
width: 100%;
height: 100%;
background: #fff;
}
#loading_box {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
text-align: center;
}
.loader {
margin: 100px auto;
font-size: 25px;
width: 1em;
height: 1em;
border-radius: 50%;
position: relative;
text-indent: -9999em;
-webkit-animation: load5 1.1s infinite ease;
animation: load5 1.1s infinite ease;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
}
@-webkit-keyframes load5 {
0%, 100% {
box-shadow: 0em -2.6em 0em 0em #018df2, 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2), 2.5em 0em 0 0em rgba(1, 141, 242, 0.2), 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.2), 0em 2.5em 0 0em rgba(1, 141, 242, 0.2), -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.2), -2.6em 0em 0 0em rgba(1, 141, 242, 0.5), -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.7);
}
12.5% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.7), 1.8em -1.8em 0 0em #018df2, 2.5em 0em 0 0em rgba(1, 141, 242, 0.2), 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.2), 0em 2.5em 0 0em rgba(1, 141, 242, 0.2), -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.2), -2.6em 0em 0 0em rgba(1, 141, 242, 0.2), -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.5);
}
25% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.5), 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.7), 2.5em 0em 0 0em #018df2, 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.2), 0em 2.5em 0 0em rgba(1, 141, 242, 0.2), -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.2), -2.6em 0em 0 0em rgba(1, 141, 242, 0.2), -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2);
}
37.5% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.2), 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.5), 2.5em 0em 0 0em rgba(1, 141, 242, 0.7), 1.75em 1.75em 0 0em #018df2, 0em 2.5em 0 0em rgba(1, 141, 242, 0.2), -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.2), -2.6em 0em 0 0em rgba(1, 141, 242, 0.2), -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2);
}
50% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.2), 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2), 2.5em 0em 0 0em rgba(1, 141, 242, 0.5), 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.7), 0em 2.5em 0 0em #018df2, -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.2), -2.6em 0em 0 0em rgba(1, 141, 242, 0.2), -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2);
}
62.5% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.2), 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2), 2.5em 0em 0 0em rgba(1, 141, 242, 0.2), 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.5), 0em 2.5em 0 0em rgba(1, 141, 242, 0.7), -1.8em 1.8em 0 0em #018df2, -2.6em 0em 0 0em rgba(1, 141, 242, 0.2), -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2);
}
75% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.2), 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2), 2.5em 0em 0 0em rgba(1, 141, 242, 0.2), 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.2), 0em 2.5em 0 0em rgba(1, 141, 242, 0.5), -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.7), -2.6em 0em 0 0em #018df2, -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2);
}
87.5% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.2), 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2), 2.5em 0em 0 0em rgba(1, 141, 242, 0.2), 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.2), 0em 2.5em 0 0em rgba(1, 141, 242, 0.2), -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.5), -2.6em 0em 0 0em rgba(1, 141, 242, 0.7), -1.8em -1.8em 0 0em #018df2;
}
}
@keyframes load5 {
0%, 100% {
box-shadow: 0em -2.6em 0em 0em #018df2, 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2), 2.5em 0em 0 0em rgba(1, 141, 242, 0.2), 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.2), 0em 2.5em 0 0em rgba(1, 141, 242, 0.2), -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.2), -2.6em 0em 0 0em rgba(1, 141, 242, 0.5), -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.7);
}
12.5% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.7), 1.8em -1.8em 0 0em #018df2, 2.5em 0em 0 0em rgba(1, 141, 242, 0.2), 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.2), 0em 2.5em 0 0em rgba(1, 141, 242, 0.2), -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.2), -2.6em 0em 0 0em rgba(1, 141, 242, 0.2), -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.5);
}
25% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.5), 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.7), 2.5em 0em 0 0em #018df2, 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.2), 0em 2.5em 0 0em rgba(1, 141, 242, 0.2), -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.2), -2.6em 0em 0 0em rgba(1, 141, 242, 0.2), -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2);
}
37.5% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.2), 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.5), 2.5em 0em 0 0em rgba(1, 141, 242, 0.7), 1.75em 1.75em 0 0em #018df2, 0em 2.5em 0 0em rgba(1, 141, 242, 0.2), -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.2), -2.6em 0em 0 0em rgba(1, 141, 242, 0.2), -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2);
}
50% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.2), 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2), 2.5em 0em 0 0em rgba(1, 141, 242, 0.5), 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.7), 0em 2.5em 0 0em #018df2, -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.2), -2.6em 0em 0 0em rgba(1, 141, 242, 0.2), -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2);
}
62.5% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.2), 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2), 2.5em 0em 0 0em rgba(1, 141, 242, 0.2), 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.5), 0em 2.5em 0 0em rgba(1, 141, 242, 0.7), -1.8em 1.8em 0 0em #018df2, -2.6em 0em 0 0em rgba(1, 141, 242, 0.2), -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2);
}
75% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.2), 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2), 2.5em 0em 0 0em rgba(1, 141, 242, 0.2), 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.2), 0em 2.5em 0 0em rgba(1, 141, 242, 0.5), -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.7), -2.6em 0em 0 0em #018df2, -1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2);
}
87.5% {
box-shadow: 0em -2.6em 0em 0em rgba(1, 141, 242, 0.2), 1.8em -1.8em 0 0em rgba(1, 141, 242, 0.2), 2.5em 0em 0 0em rgba(1, 141, 242, 0.2), 1.75em 1.75em 0 0em rgba(1, 141, 242, 0.2), 0em 2.5em 0 0em rgba(1, 141, 242, 0.2), -1.8em 1.8em 0 0em rgba(1, 141, 242, 0.5), -2.6em 0em 0 0em rgba(1, 141, 242, 0.7), -1.8em -1.8em 0 0em #018df2;
}
}
/* -----------------------------
Contact繝輔か繝ｼ繝�
----------------------------- */
.contact-form {
margin: 3em auto;
}
.contact-form dl.form-group {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
width: 100%;
max-width: 796px;
margin: 0 auto;
}
.contact-form dl.form-group dt {
width: 30%;
text-align: right;
padding: 40px 30px 40px 0px;
}
.contact-form dl.form-group dd {
width: 70%;
padding: 30px 20px 40px 0;
}
.contact-form .form-group label {
vertical-align: middle;
line-height: 1.5rem;
}
.contact-form .form-group small {
display: block;
color: #868686;
margin-top: .5rem;
}
.contact-form .form-group .font08em {
font-size: 0.8em;
}
.contact-form .form-group .form-check {
margin-bottom: 1.25rem;
}
.contact-form .form-group .form-control {
height: calc(2.5em + .75rem + 2px);
font-size: 1.1rem;
}
.contact-form .form-group textarea.form-control {
height: calc(5em + .75rem + 2px);
}
.contact-form .form-group .form-check label {
margin-bottom: 0;
vertical-align: baseline;
}
.contact-form .form-group .form-check .form-check-input {
position: relative;
vertical-align: baseline;
height: 15px;
line-height: 15px;
}
.contact-form .form-group .form-check .form-control-sm {
display: inline-block;
width: 300px;
height: calc(1.5em + .75rem + 2px);
margin-left: 5px;
}
.contact-form .form-group .privacy-check {
font-size: 1.5rem;
font-weight: bold;
margin: 1em 0;
}
.contact-form .button-form {
width: 100%;
background-color: #575757;
color: #ffffff;
display: block;
font-size: 1.25em;
font-weight: bold;
text-align: center;
text-decoration: none;
padding: 1em;
margin: 2em auto;
border-radius: 5px;
transition: .3s;
max-width: 1200px;
}
.contact-form .button-form:hover {
background-color: #7C7C7C;
}
.contact-form .required {
font-size: .75rem;
color: #fff;
background-color: #e6001a;
font-weight: bold;
display: inline-block;
margin-left: .5rem;
vertical-align: middle;
padding: .25rem;
border-radius: 3px;
line-height: 1.5;
}
.contact-form .form-group input::placeholder, .contact-form .form-group textarea::placeholder {
color: #bcbcbc;
}
.contact-form .form-group input::-ms-input-placeholder, .contact-form .form-group textarea::-ms-input-placeholder {
color: #bcbcbc;
}
.contact-form .form-group input:-ms-input-placeholder, .contact-form .form-group textarea:-ms-input-placeholder {
color: #bcbcbc;
}
@media only screen and (max-width: 750px) {
.contact-form {
margin: 0.5em auto;
}
.contact-form .form-group .form-check .form-check-input {
position: absolute;
margin-top: 0.3rem;
}
.contact-form .form-group .form-check.privacy-check .form-check-input {
margin-top: .4rem;
}
.contact-form .form-group .form-check .form-control-sm {
width: 100%;
display: block;
margin-top: 5px;
margin-left: 0;
}
.contact-form dl {
padding: 1em 0;
display: block;
margin-bottom: 5px;
}
.contact-form dl.form-group dt {
width: 100%;
padding: 0 0 10px 0;
text-align: left;
font-size: 1.0em;
}
.contact-form dl.form-group dd {
width: 100%;
padding: 0 0 0 20px;
margin-top: 5px;
font-size: .9em;
}
.contact-form dl.form-group dd label {
padding: 0 0 0 20px;
}
.sp_none {
display: none;
}
}
.flat-table {
font-size: 115%;
overflow: auto;
width: 100%;
max-width: 1080px;
margin-left: auto;
margin-right: auto;
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}
.flat-table th {
background-color: #5C83A3;
color: white;
font-weight: normal;
padding: 20px 30px;
text-align: center;
width: 50%;
}
.flat-table td {
background-color: rgb(238, 238, 238);
color: #212529;
border-bottom: 1px dotted #5C83A3;
padding: 20px 30px;
}
.flat-table td.nagano-arrow {
background:rgba(255,255,255,0);
padding: 5px;
text-align: center;
border-bottom: none;
}
@media only screen and (max-width: 750px) {
.flat-table {
font-size: 1em;
width: 100%;
max-width: 100%;
margin-left: 0;
margin-right: 0;
}
#relief .common-inner {
padding-left:0px;
padding-right: 0px;
}
.flat-table th, .flat-table td {
padding: 10px 10px;
border: 1px solid #ffffff;
}
}
span.text-doubleline {
border-bottom: double 2px #D88A4F;
}
.text-w {
width: 90%;
}
.text-link a {
color: #007bff;
}
input::placeholder {
color: #316464;
}
/* for Chrome/Safari/Opera */
::-webkit-input-placeholder {
color: #316464;
}
/* for Edge */
::-ms-input-placeholder {
color: #316464;
}
.sbs-first .btn-g a {
display: block;
font-size: 1.75em;
font-weight: 600;
color: #fff;
background-color: #316464;
padding: .5em;
width: 50%;
border-radius: 4em;
box-sizing: border-box;
margin: 20px 25%;
text-align: center;
}
.sbs-first .btn-g a:hover {
background: #2A554F;
color: #fff;
}
@media only screen and (max-width: 750px) {
.sbs-first .btn-g a {
display: block;
font-size: 1em;
font-weight: 600;
color: #fff;
background-color: #316464;
padding: .5em;
width: 90%;
border-radius: 4em;
box-sizing: border-box;
margin: 20px 5%;
text-align: center;
}
}
/*question_block 縺薙％縺九ｉ*/
#resolvable .resolvable_inner .contents_body .question_block {
padding: 100px 0 0;
position: relative
}
#resolvable .resolvable_inner .contents_body .question_block h2 {
margin-bottom: 60px
}
#resolvable .resolvable_inner .contents_body .question_block h2 span.q {
background: url(../../com/img/q.png) 100%/100% no-repeat;
display: inline-block;
text-indent: -9999px;
vertical-align: middle;
margin-right: .5em;
width: 55px;
height: 60px;
overflow: hidden
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner {
display: flex;
align-items: flex-end;
justify-content: space-between;
flex-wrap: wrap;
margin: 0 auto;
margin-bottom: 280px;
max-width: 1080px;
width: 100%
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container-2 {
position: relative;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
background-color: #f1f1f1;
width: calc(33.33% - 30px);
height: 200px;
font-size: 1.25em;
font-weight: 500;
line-height: 1.75;
color: #151c51;
border-radius: 40px 10px 40px 10px;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container::before, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container-2::before {
content: '';
width: 45px;
height: 35px;
background: url(../../com/img/double_quotes.png) center/contain no-repeat;
position: absolute;
top: -10px;
left: 0;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container {
position: relative;
justify-content: center;
align-items: center;
text-align: center;
background-color: #f1f1f1;
width: calc(33.33% - 30px);
height: 350px;
font-size: 1.25em;
font-weight: 500;
line-height: 1;
color: #151c51;
border-radius: 40px 10px 40px 10px;
padding: 20px 20px 50px 20px;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container::before {
content: '';
width: 45px;
height: 35px;
background: url(../../com/img/double_quotes.png) center/contain no-repeat;
position: absolute;
top: -10px;
left: 0;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p {
display: block;
margin-bottom: 0.5em;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p.reason_title {
font-size: 1.6em;
letter-spacing: 0.2em;
font-weight: 600;
margin-bottom: 0.5em;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p.reason_txt {
font-size: 0.75em;
font-weight: normal;
margin-top: 1em;
text-align: left;
border-top: 1px solid #151c51;
padding-top: 0.75em;
line-height: 2em;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container p.reason_txt_s {
font-size: 0.6em;
font-weight: normal;
text-align: left;
padding-top: 0.5em;
line-height: 1.5em;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container.q_01::after, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container-2.q_01::after {
content: '';
width: 300px;
height: 225px;
background: url(../../com/img/case01.png) center/contain no-repeat;
transform: translateY(-50%) translateX(-50%);
position: absolute;
bottom: -300px;
left: 50%;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container.q_02::after, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container-2.q_02::after {
content: '';
width: 300px;
height: 225px;
background: url(../../com/img/case02.png) center/contain no-repeat;
transform: translateY(-50%) translateX(-50%);
position: absolute;
bottom: -300px;
left: 50%;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container.q_03::after {
content: '';
width: 300px;
height: 225px;
background: url(../../com/img/case03.png) center/contain no-repeat;
transform: translateY(-50%) translateX(-50%);
position: absolute;
bottom: -300px;
left: 50%;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container-2.q_04::after {
content: '';
width: 300px;
height: 225px;
background: url(../../com/img/case04.png) center/contain no-repeat;
transform: translateY(-50%) translateX(-50%);
position: absolute;
bottom: -300px;
left: 50%;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container.q_01-2::after {
content: '';
width: 300px;
height: 225px;
background: url(../../com/img/point01.png) center/contain no-repeat;
transform: translateY(-50%) translateX(-50%);
position: absolute;
bottom: -300px;
left: 50%;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container.q_02-2::after {
content: '';
width: 300px;
height: 225px;
background: url(../../com/img/point02.png) center/contain no-repeat;
transform: translateY(-50%) translateX(-50%);
position: absolute;
bottom: -300px;
left: 50%;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container.q_03-2::after {
content: '';
width: 300px;
height: 225px;
background: url(../../com/img/point03.png) center/contain no-repeat;
transform: translateY(-50%) translateX(-50%);
position: absolute;
bottom: -300px;
left: 50%;
}
#resolvable .resolvable_inner .contents_body .question_block::after {
content: "";
border-left: 120px solid transparent;
border-right: 120px solid transparent;
border-top: 60px solid #fff;
display: block;
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%)
}
@media screen and (max-width: 1060px) {
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner {
padding: 0 20px;
width: auto;
margin-bottom: 220px;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container-2 {
width: calc(33.33% - 20px);
height: 150px;
font-size: 1em;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container::before, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container-2::before {
width: 40px;
height: 31px;
top: -5px;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container.q_01::after, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container.q_01-2::after, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container-2.q_01::after {
width: 250px;
height: 150px;
bottom: -200px;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container.q_02::after, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container.q_02-2::after, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container-2.q_02::after {
width: 250px;
height: 150px;
bottom: -200px;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container.q_03::after, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container.q_03-2::after, #resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container-2.q_04::after {
width: 250px;
height: 150px;
bottom: -200px;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container {
width: calc(33.33% - 20px);
height: 300px;
font-size: 1em;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container::before {
width: 40px;
height: 31px;
top: -5px;
}
}
@media screen and (max-width: 750px) {
#resolvable .resolvable_inner .contents_body .question_block {
padding: 80px 0 0;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner {
margin-bottom: 0;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container {
width: 100%;
margin: 0 auto 180px;
font-size: 1.1em;
height: 180px;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q_container-2 {
width: 85%;
margin: 0 auto 180px;
font-size: 1.1em;
height: 180px;
}
#resolvable .resolvable_inner .contents_body .question_block .q_b_inner .q2_container {
width: 100%;
margin: 0 auto 180px;
font-size: 1.1em;
height: 260px;
}
}
#resolvable .resolvable_inner .contents_body .answer_block, #resolvable2 .resolvable_inner .contents_body .answer_block {
padding: 170px 0 100px;
background-color: #6c9ad1;
}
#resolvable .resolvable_inner .contents_body .answer_block h2, #resolvable2 .resolvable_inner .contents_body .answer_block h2 {
color: #fff;
font-size: 4em;
margin-bottom: 0;
}
#resolvable .resolvable_inner .contents_body .answer_block h2 small, #resolvable2 .resolvable_inner .contents_body .answer_block h2 small {
font-size: .7em;
font-weight: 900;
}
#resolvable .resolvable_inner .contents_body .answer_block .sub_title {
color: #fff;
font-size: 2em;
font-weight: 700;
text-align: center;
margin-bottom: 1em;
}
#resolvable .resolvable_inner .contents_body .answer_block .sub_title span {
color: #ffff00;
font-size: 1.8em;
}
#resolvable2 .resolvable_inner .contents_body .answer_block .sub_title {
color: #fff;
font-size: 3em;
font-weight: 700;
text-align: center;
margin-bottom: 1em;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison {
position: relative;
display: flex;
justify-content: space-between;
align-items: flex-end;
max-width: 1080px;
margin: 0 auto 3em;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_container, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container {
width: calc(50% - 80px);
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_container p, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container p {
text-align: center;
font-size: 1.25em;
font-weight: 600;
color: #fff;
margin-bottom: 10px;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_container p small, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container p small {
margin-left: 5px;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_container figure, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container figure {
margin: 0;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_container figure img, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container figure img {
max-width: 100%;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_arrow, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow {
position: absolute;
width: 195px;
transform: translateY(-50%) translateX(-50%);
top: 50%;
left: 50%;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_arrow p, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow p {
font-size: 2.5em;
font-weight: 700;
color: #fff;
text-align: center;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_arrow figure, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow figure {
margin: 0;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_arrow figure img, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow figure img {
max-width: 100%;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .merit_heading, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .merit_heading {
display: block;
width: 470px;
margin: 5em auto 2em;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .merit_heading img, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .merit_heading img {
max-width: 100%;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block {
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
max-width: 1080px;
margin: 1em auto;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box {
width: 336px;
height: 377px;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box.merit01, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box.merit01 {
background: url(../../com/img/merit_container01.png) center/contain no-repeat;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box.merit02, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box.merit02 {
background: url(../../com/img/merit_container02.png) center/contain no-repeat;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box.merit03, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box.merit03 {
background: url(../../com/img/merit_container03.png) center/contain no-repeat;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box-2, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box-2 {
width: 336px;
height: 441px;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box-2.merit01-2, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box-2.merit01-2 {
background: url(../../com/img/merit_container01-2.png) center/contain no-repeat;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box-2.merit02-2, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box-2.merit02-2 {
background: url(../../com/img/merit_container02-2.png) center/contain no-repeat;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box-2.merit03-2, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box-2.merit03-2 {
background: url(../../com/img/merit_container03-2.png) center/contain no-repeat;
}
#resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box {
width: 336px;
height: 450px;
}
#resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box.support01 {
background: url(../../com/img/support_backimg.png) center/contain no-repeat;
}
#resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img {
width: auto;
height: 150px;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner {
width: 320px;
height: 346px;
transform: translateY(4.2%) translateX(.2%);
padding: 1.5em;
box-sizing: border-box;
text-align: center;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img {
width: auto;
height: 94px;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title {
font-size: 1.4em;
font-weight: 600;
color: #00539b;
margin: 10px 0;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail {
font-size: 1em;
text-align: justify;
color: #00539b;
margin: 15px 0 0;
}
#resolvable .resolvable_inner .contents_body .answer_block .benefit, #resolvable2 .resolvable_inner .contents_body .answer_block .benefit {
font-size: 2em;
font-weight: 700;
text-align: center;
color: #fff;
background-color: #00539b;
padding: 1em;
margin: 2em auto;
border-radius: 10px 40px 10px 40px;
max-width: 1080px;
box-sizing: border-box;
}
@media screen and (max-width: 1060px) {
#resolvable .resolvable_inner .contents_body .answer_block, #resolvable2 .resolvable_inner .contents_body .answer_block {
padding: 150px 20px 100px;
width: auto
}
#resolvable .resolvable_inner .contents_body .answer_block h2, #resolvable2 .resolvable_inner .contents_body .answer_block h2 {
font-size: 3.5em;
}
#resolvable .resolvable_inner .contents_body .answer_block .sub_title, #resolvable2 .resolvable_inner .contents_body .answer_block .sub_title {
font-size: 1.5em;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_container p, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container p {
font-size: 1em;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_container, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container {
width: calc(50% - 60px);
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_arrow, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow {
width: 160px;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_arrow p, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow p {
font-size: 2em;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box {
width: 230px;
height: 258px;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box-2, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box-2 {
width: 230px;
height: 258px;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner {
width: 219px;
height: 237px;
padding: 1em;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title {
font-size: 1em;
margin: 5px 0;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img {
height: 70px;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail {
font-size: .6em;
margin: 5px 0 0;
}
#resolvable .resolvable_inner .contents_body .answer_block .benefit, #resolvable2 .resolvable_inner .contents_body .answer_block .benefit {
font-size: 1.5em;
margin: 2em auto 1em;
}
}
@media screen and (min-width: 780px) and (max-width: 1060px) {
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block {
justify-content: center;
}
}
@media screen and (max-width: 750px) {
#resolvable .resolvable_inner .contents_body .answer_block, #resolvable2 .resolvable_inner .contents_body .answer_block, #resolvable4 .resolvable_inner .contents_body .answer_block {
padding: 100px 20px 100px;
}
#resolvable .resolvable_inner .contents_body .answer_block h2, #resolvable2 .resolvable_inner .contents_body .answer_block h2, #resolvable4 .resolvable_inner .contents_body .answer_block h2 {
font-size: 1.8em;
}
#resolvable .resolvable_inner .contents_body .answer_block .sub_title {
font-size: 1em;
margin-bottom: 3em;
}
#resolvable2 .resolvable_inner .contents_body .answer_block .sub_title, #resolvable4 .resolvable_inner .contents_body .answer_block .sub_title {
font-size: 1.5em;
margin-bottom: 2em;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison #resolvable4 .resolvable_inner .contents_body .answer_block .comparison {
flex-wrap: wrap;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_container, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_container, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_container {
width: 100%;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_arrow, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_arrow {
width: auto;
height: 140px;
position: inherit;
transform: inherit;
margin: auto;
top: auto;
left: auto;
display: flex;
align-items: center;
justify-content: center;
}
#resolvable .resolvable_inner .contents_body .answer_block .comparison_arrow figure, #resolvable2 .resolvable_inner .contents_body .answer_block .comparison_arrow figure, #resolvable4 .resolvable_inner .contents_body .answer_block .comparison_arrow figure {
transform: rotate(90deg);
width: 100px;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .merit_heading, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .merit_heading, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .merit_heading {
width: 100%;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block {
flex-wrap: wrap;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box {
width: 336px;
height: 377px;
margin: 0 auto 3em;
}
#resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box {
width: 336px;
height: 450px;
margin: 0 auto 3em;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box-2, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box-2 #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_box-2 {
width: 336px;
height: 400px;
margin: 0 auto 3em;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner {
width: 320px;
height: 346px;
padding: 1.5em;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_title {
font-size: 1.4em;
margin: 10px 0;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner img {
height: 94px;
}
#resolvable .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail, #resolvable2 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail, #resolvable4 .resolvable_inner .contents_body .answer_block .elected .contents_block .e_b_inner .merit_detail {
font-size: .9em;
margin: 10px 0 0;
}
#resolvable .resolvable_inner .contents_body .answer_block .benefit, #resolvable2 .resolvable_inner .contents_body .answer_block .benefit, #resolvable4 .resolvable_inner .contents_body .answer_block .benefit {
font-size: 1.4em;
margin: 0 auto 1em;
border-radius: 5px 20px 5px 20px;
text-align: justify;
}
}