@charset "UTF-8";

/*---------- ページ全体の指定 ----------*/

body {
font-family:'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
margin:0;
padding:0;
font-size:100%;
}

a:link {color:#3b5998;text-decoration:underline;}
a:visited {color:#3b5998;text-decoration:underline;}
a:hover {color:#206CFF;text-decoration:none;}
a img {border-style:none;}
a:hover img{
opacity:0.6;
filter:alpha(opacity=60);
}
a img {
border-style:none;
-webkit-transition: all .3s;
transition:all .3s;
}
img {vertical-align:bottom;image-rendering: -webkit-optimize-contrast;}
.clr{clear:both;}

p {
font-size:110%;
line-height:180%;
}
@media screen and (min-width:769px){
p {
font-size:18px;
line-height:180%;
letter-spacing:1px;
}
}

@media screen and (max-width:768px){.spnone{display:none;}}
@media screen and (min-width:769px){.pcnone{display:none;}}

#copy{
margin:0;
padding:0;
background:#fff;
position:relative;
z-index:0;
overflow:hidden;
}
#copy::before {
content: '';
display:block;
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
background-color:#F8FAFB;
transform-origin:bottom right;
transform:skewY(-55deg);
z-index: -1;
}
h1{
margin:0;
padding:10px 0 15px 0;
text-align:center;
}
h1 img{width:90%;}
.copy_pict{
margin:0;
padding:0;
text-align:center;
}
.copy_pict img{width:40%;}
.copy_sub{
margin:0;
padding:20px 0 15px 0;
text-align:center;
}
.copy_sub img{width:90%;}
.copy_lead{
margin:0;
padding:0 15px 20px 15px;
font-size:100%;
font-weight:bold;
line-height:170%;
text-align:center;
}
@media screen and (min-width:769px) {
#copy{padding:15px 0 45px 0;text-align:center;}
#copy img {width:980px;}
#copy::before {transform:skewY(-30deg);background-color:#F8FAFB;}
}

.device_back{
margin:0;
padding:30px 25px 40px 25px;
background:#191919;
}
.device_txt{
margin:0;
padding:0;
font-size:98%;
font-weight:bold;
line-height:150%;
text-align:center;
color:#fff;
letter-spacing:1px;
}
.device_title{
margin:0;
padding:15px 0 20px 0;
text-align:center;
}
.device_title img{width:75%;}
.device{
margin:0;
padding:0;
text-align:center;
}
.device a:link {color:#191919;text-decoration:none;}
.device a:visited {color:#191919;text-decoration:none;}
.device a:hover {color:#fff;text-decoration:none;}
.btn {
width:100%;
margin:0 auto;
padding:25px 0;
display:inline-block;
font-size:125%;
font-weight:bold;
text-decoration:none;
text-align:center;
background-color:#fff;
border:1px solid #fff;
}
.btn:hover {
background-color:#191919;
-webkit-transition:0.3s ease-in-out;
-moz-transition:0.3s ease-in-out;
-o-transition:0.3s ease-in-out;
transition:0.3s ease-in-out;
}
@media screen and (min-width:769px) {
.device_back{padding:60px 0 75px 0;}
.device_txt{font-size:24px;letter-spacing:1px;}
.device_title{padding:25px 0 35px 0;}
.device_title img{width:580px;}
.btn {width:480px;font-size:24px;letter-spacing:1px;}
}

.txt_01{
margin:30px 20px 30px 20px;
padding:0;
text-align:center;
}
.txt_01 img{width:100%;}
@media screen and (min-width:769px) {
.txt_01{margin:60px 0 45px 0;}
.txt_01 img{width:640px;}
}

.situation_bg{
margin:0 0 60px 0;
padding:0 15px 30px 15px;
background:#1a4369;
}
.triangle{
margin:0 auto 20px auto;
padding:0;
text-align:center;
width:0;
height:0;
border-left:30px solid transparent;
border-right:30px solid transparent;
border-top:20px solid #fff;
}
.situation_top{
margin:0;
padding:0 20px 20px 20px;
text-align:center;
}
.situation_top img{width:100%;}
.situation_frame{
margin:0;
padding:15px 25px 15px 25px;
background:#fff;
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
.situation_subhead{
margin:30px 0 0 0;
padding:0 0 10px 0;
font-size:140%;
font-weight:900;
line-height:160%;
color:#2c3e78;
border-bottom:1px solid #2c3e78;
font-family: "Noto Sans Japanese";
}
.graf{
margin:20px 0 0 0;
padding:0;
text-align:center;
}
.graf img{width:100%;}
.graf_caption{
margin:0;
padding:15px 0 0 0;
font-size:75%;
line-height:150%;
color:#666;
text-align:left;
}
@media screen and (min-width:769px){
.situation_bg{
margin:0 0 90px 0;
padding:0 0 45px 0;
}
.triangle{
margin:0 auto 20px auto;
padding:0;
text-align:center;
width:0;
height:0;
border-left:30px solid transparent;
border-right:30px solid transparent;
border-top:20px solid #fff;
}
.situation_top{padding:0 0 30px 0;}
.situation_top img{width:640px;}
.situation_frame{
width:640px;
margin:0 auto;
padding:30px 120px 30px 120px;
}
.situation_subhead{
margin:45px 0 0 0;
padding:0 0 10px 0;
font-size:28px;
}
.graf{
margin:20px 0 0 0;
padding:0;
text-align:center;
}
.graf img{width:100%;}
.graf_caption{
margin:0;
padding:15px 0 0 0;
font-size:75%;
line-height:150%;
color:#666;
text-align:left;
}
}











h2{}
h3{}

.subhead{
margin:0 20px 30px 20px;
padding:0;
font-size:180%;
font-weight:900;
line-height:150%;
text-align:center;
font-family: "Noto Sans Japanese";
}
.line_sbh{
width:45px;
margin:-15px auto 30px auto;
padding:0;
height:0;
border:0;
border-top:3px double #e58d95;
}
@media screen and (min-width:769px){
.mark img{width:240px;}
.subhead{margin:0 0 45px 0;font-size:36px;letter-spacing:1px;}
.subject{margin:45px 0 0 0;font-size:24px;}
}

.contents{
margin:0 25px 60px 25px;
padding:0;
}
.contents_form{
margin:0 0 60px 0;
padding:45px 25px 60px 25px;
background:#f5f5f5;
}
table.check{
width:100%;
border-collapse:collapse;
margin:0;
}
table.check th{
width:30px;
font-size:120%;
line-height:150%;
padding:12px 0 5px 0;
color:#2c3e78;
vertical-align:top;
text-align:left;
}
table.check td{
font-size:120%;
line-height:150%;
font-weight:bold;
padding:12px 0 5px 0;
border-bottom:dotted 1px #ccc;
vertical-align:top;
}
.contents_box{margin:0 20px 45px 20px;padding:0;}
.contents_txt{margin:0;padding:0;}
.contents_pict{margin:0 0 30px 0;padding:0;}
.contents_pict img{width:100%;}
.order_01{}
.order_02{}
.merit_top{
margin:0;
padding:0;
text-align:center;
font-size:125%;
font-weight:900;
line-height:150%;
text-align:center;
font-family: "Sawarabi Mincho";
}
.merit_box{
margin:30px 20px 0 20px;
padding:0 0 30px 0;
display:-webkit-flex;
display:-moz-flex;
display:-ms-flex;
display:-o-flex;
display:flex;
-webkit-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
justify-content:space-between;
}
.merit{
width:48%;
margin:0 0 20px 0;
padding:20px;
font-size:100%;
font-weight:bold;
line-height:150%;
text-align:center;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border:double 3px #d6d1c9;
}
.merit img{width:100%;}
@media screen and (min-width:769px){
.contents{width:768px;margin:0 auto 90px auto;}
.contents_form{
width:640px;
padding:75px 150px 90px 150px;
margin:0 auto 90px auto;
-webkit-border-radius:20px;
-moz-border-radius:20px;
border-radius:20px;
}
table.check{margin:5px 0 0 0;}
table.check th{
width:26px;
font-size:18px;
padding:10px 0 5px 0;
}
table.check td{
font-size:18px;
letter-spacing:1px;
padding:10px 0 5px 0;
}
.contents_box{
width:1080px;
margin:0 auto 90px auto;
display:-webkit-flex;
display:-moz-flex;
display:-ms-flex;
display:-o-flex;
display:flex;
-webkit-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
justify-content:space-between;
}
.contents_txt{width:48%;}
.contents_pict{width:48%;margin:0;}
.order_01{order:1;}
.order_02{order:2;}
.merit_top{margin:-45px 0 0 0;font-size:30px;}
.merit_box{width:900px;margin:45px auto 0 auto;padding:0 0 60px 0;justify-content:center;}
.merit{width:260px;margin:0 20px 30px 20px;padding:5px 20px 20px 20px;font-size:18px;}
}


.feature_bg{
margin:0 0 60px 0;
padding:60px 25px 30px 25px;
background:#eaf1f2;
}
.feature_lead{
margin:0 0 20px 0;
padding:10px 25px 25px 25px;
background:#fff;
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
.feature_lead ol {
counter-reset:my-counter;
list-style:none;
padding:0;
margin:0;
}
.feature_lead li {
font-size:110%;
font-weight:bold;
line-height:180%;
padding:10px 0 5px 30px;
position:relative;
border-bottom:dotted 1px #ccc;
}
.feature_lead li:before {
content:counter(my-counter);
counter-increment:my-counter;
background-color:#1a4369;
border-radius:50%;
box-sizing:border-box;
display:flex;
justify-content:center;
align-items:center;
height:22px;
width:22px;
color:#fff;
font-size:85%;
line-height:1;
position:absolute;
top:13px;
left:0;
}
.feature_txt{margin:0;padding:0;}
.feature_number{
margin:0;
padding:30px 0 20px 0;
font-size:21px;
font-weight:bold;
line-height:100%;
text-align:center;
font-family: 'Roboto Condensed', sans-serif;
}
.feature_number span{
padding:10px 17px;
color:#fff;
background:#1a4369;
-webkit-border-radius:50%;
-moz-border-radius:50%;
border-radius:50%;
}
.feature_title{
margin:0;
padding:0;
font-size:150%;
font-weight:900;
line-height:150%;
text-align:center;
font-family: "Noto Sans Japanese";
}
.feature_pict{
margin:0;
padding:20px 0 5px 0;
text-align:center;
}
.feature_pict img{width:80%;}
table.spec{
width:100%;
border-collapse:separate;
margin:0;
}
table.spec th{
width:120px;
padding:10px 0;
font-size:110%;
line-height:180%;
color:#fff;
background:#1a4369;
}
table.spec td{
padding:10px 0 10px 15px;
font-size:110%;
line-height:180%;
border-bottom:solid 1px #1a4369;
}
.feature_subtitle{
margin:30px 0 0 0;
padding:0;
font-size:130%;
font-weight:900;
line-height:150%;
color:#1a4369;
font-family: "Noto Sans Japanese";
}
@media screen and (min-width:769px){
.feature_bg{
margin:0 0 90px 0;
padding:75px 0 30px 0;
}
.feature_lead{
width:640px;
margin:0 auto 20px auto;
padding:20px 45px 35px 45px;
}
.feature_lead li {
font-size:18px;
font-weight:bold;
line-height:180%;
padding:10px 0 5px 30px;
position:relative;
border-bottom:dotted 1px #ccc;
}
.feature_lead li:before {font-size:14px;top:14px;}
.feature_txt{width:768px;margin:0 auto;}
.feature_number{padding:30px 0 20px 0;}
.feature_title{font-size:36px;letter-spacing:1px;}
.feature_pict{padding:20px 0 5px 0;}
.feature_pict img{width:480px;}
table.spec{
width:100%;
border-collapse:separate;
margin:0;
}
table.spec th{
width:120px;
padding:10px 0;
font-size:18px;
line-height:180%;
color:#fff;
background:#1a4369;
}
table.spec td{
padding:10px 0 10px 15px;
font-size:18px;
line-height:180%;
border-bottom:solid 1px #1a4369;
}
.feature_subtitle{
margin:45px 0 0 0;font-size:28px;letter-spacing:1px;}
}

.qus{
margin:0;
padding:0 0 0 28px;
font-size:120%;
font-weight:bold;
line-height:150%;
position:relative;
}
.qus:after {
position:absolute;
top:-1px;
left:0;
content:"Q.";
font-size:24px;
color:#1a4369;
font-family: 'Roboto Condensed', sans-serif;
}
.ans{
margin:5px 0 20px 0;
padding:0 0 0 48px;
position:relative;
border:solid 2px #eee;
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
.ans:after {
position:absolute;
top:17px;
left:20px;
content:"A.";
font-size:24px;
color:#c5593e;
font-family: 'Roboto Condensed', sans-serif;
}
@media screen and (min-width:769px){
.qus{font-size:20px;letter-spacing:1px;}
.ans{margin:10px 0 30px 0;}
.ans:after {top:18px;}
}



table.info{
width:100%;
border-collapse:separate;
margin:0 0 20px 0;
}
table.info th{
width:100px;
padding:10px 0;
font-size:90%;
line-height:180%;
background:#f9f9f9;
border-bottom:solid 1px #eee;
}
table.info td{
padding:10px 0 10px 10px;
font-size:90%;
line-height:180%;
border-bottom:solid 1px #eee;
}
.space{margin:10px 0 0 0;padding:0;}
@media screen and (min-width:769px){
table.info th{width:140px;font-size:18px;letter-spacing:1px;}
table.info td{padding:15px 15px;font-size:16px;letter-spacing:1px;}
}


/*---------- お問い合わせフォーム ----------*/

table.form{
width:100%;
border-collapse:collapse;
margin:-20px 0 0 0;
}
table.form th{
font-size:100%;
line-height:150%;
padding:15px 0 5px 0;
text-align:left;
display:block;
}
table.form td{
font-size:100%;
line-height:150%;
padding:0 0 5px 0;
display:block;
}
.any{
margin:0;
padding:0;
float:right;
text-align:right;
}
.any span{
margin:0;
padding:1px 2px 2px 2px;
font-size:80%;
font-weight:normal;
line-height:100%;
color:#fff;
background:#999;
}
.req{
margin:0;
padding:0;
float:right;
text-align:right;
}
.req span{
margin:0;
padding:1px 2px 2px 2px;
font-size:80%;
font-weight:normal;
line-height:100%;
color:#fff;
background:#c5593e;
}
.space{margin:0;padding:10px 0 0 0;}
.selectbox select {
background: url(img/arrow_pull.png) right 50% no-repeat, -webkit-linear-gradient(top, #fff 0%,#fff 100%);
background: url(img/arrow_pull.png) right 50% no-repeat, linear-gradient(to bottom, #fff 0%,#fff 100%);
background-size: 20px, 100%;
padding:10px 30px 10px 10px;
margin-bottom:10px;
}
select::-ms-expand {
display: none;
}
.kakunin{
margin:30px;
padding:0;
}
@media screen and (min-width:769px){
table.form{margin:-20px 0 0 0;}
table.form th{
width:180px;
font-size:16px;
padding:15px 15px 5px 0;
text-align:left;
border-bottom:solid 1px #ccc;
display:table-cell;
}
table.form td{
font-size:16px;
padding:15px 0 5px 5px;
display:table-cell;
}
.any span{font-size:12px;}
.req span{font-size:12px;}
.kakunin{width:360px;margin:30px auto;}
}

/*---------- お問い合わせフォーム入力～送信ボタン部分 ----------*/

input[type="text"], textarea, select {
width:100%;
border:0;
padding:10px;
font-size:100%;
border:solid 1px #ccc;
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
-o-appearance:none;
border-radius:3px;
box-shadow:inset 1px 4px 9px -6px rgba(0,0,0,0.5);
box-sizing:border-box;
}
input[type="text"]:focus,
textarea:focus {
box-shadow:0 0 7px #999999;
}

::-webkit-input-placeholder{color:#999;}

input[type="submit"],input[type="button"] {
border-radius:0;
appearance:button;
box-sizing:border-box;
cursor:pointer;
webkit-transition:all .5s;transition:all .5s;
border:none;
font-family:'Yu Gothic Medium', '游ゴシック Medium', YuGothic, '游ゴシック体', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', sans-serif;
color:#fff;
border:solid 1px #6a9700;
text-shadow:0 2px 0 rgba(0,0,0,0.3);
background:-moz-linear-gradient(top, #afe51f, #59b802);
background:-webkit-linear-gradient(top, #afe51f, #59b802);
background:linear-gradient(to bottom, #afe51f, #59b802);
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {display:none;}

@media screen and (min-width:769px){
input[type="text"], textarea, select {font-size:16px;}
}



/*---------- お問い合わせフォームボタンの補足装飾 ----------*/

.submit{
margin:15px 0 0 0;
padding:0;
text-align:center;
}
.submit a:link {color:#fff;text-decoration:none;}
.submit a:visited {color:#fff;text-decoration:none;}
.submit a:hover {color:#fff;text-decoration:none;}
.button {
width:80%;
margin:0 auto;
padding:15px 0 15px 0;
font-size:120%;
font-weight:bold;
display:inline-block;
text-decoration:none;
text-align:center;
}
.button:hover {
opacity:0.6;
filter:alpha(opacity=60);
-webkit-transition:0.3s ease-in-out;
-moz-transition:0.3s ease-in-out;
-o-transition:0.3s ease-in-out;
transition:0.3s ease-in-out;
}
@media screen and (min-width:769px){
.submit{margin:30px 0 0 0;}
.button {width:480px;font-size:21px;}
}


.mt{margin-top:30px;}
.caption{margin:0;padding:0;font-size:75%;color:#666;font-weight:normal;}
@media screen and (min-width:769px){
.mt{margin-top:45px;}
.caption{font-size:14px;}
}


/*---------- 文字装飾 ----------*/

.bold{font-weight:bold;}
.ul{text-decoration:underline;}
.red{font-weight:bold;color:#ff4757;}
.org{font-weight:bold;color:#ff8c00;}
.blue{font-weight:bold;color:#26a6d4;}
.through{text-decoration:line-through;}
.ym{background:linear-gradient(transparent 60%, #f5e29b 60%);}


/*---------- 文字位置 ----------*/

.center{text-align:center;}
.right{text-align:right;}


/*---------- フッター ----------*/

#footer{
margin:0;
padding:30px 0;
font-size:75%;
line-height:150%;
text-align:center;
color:#fff;
background:#191919;
font-family: 'Roboto Condensed', sans-serif;
}
#footer a:link {color:#fff;text-decoration:none;}
#footer a:visited {color:#fff;text-decoration:none;}
#footer a:hover {color:#fff;text-decoration:underline;}
@media screen and (min-width:769px){#footer{margin:0;font-size:12px;}}


.ex_box{margin:0;padding:0;}

/* Bnr
-----------------------------------------*/
.Bnr{
width:75%;
margin:0 0 0 auto;
padding:0;
position:relative;
display:none;
}
.Bnr .Bnr__img{
margin:0;
padding:0;
position:fixed;
bottom:0;
background:#fff;
box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
z-index:88;
}
.Bnr__img__inner{
width:100%;
margin:0;
padding:10px;
box-sizing:border-box;
background-color:#1a4369;
font-size:100%;
font-weight:bold;
line-height:150%;
text-align:center;
}
.Bnr__img__inner a:link {color:#fff;text-decoration:none;}
.Bnr__img__inner a:visited {color:#fff;text-decoration:none;}
.Bnr__img__inner a:hover {color:#fff;text-decoration:none;}
.Bnr .Bnr__img__inner a{  display: block;}
.Bnr .Bnr__img p.close{
  position: absolute;
  right: 10px;
  top:-12px;
}
.Bnr .Bnr__img p.close a{
  display: block;
  width: 20px;
  height: 25px;
  text-align: center;
}
.Bnr .Bnr__img p.close a span{
  display: block;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.Bnr .Bnr__img p.close a i{
  font-size:100%;
  z-index: 888;
  color: #fff;
}

@media screen and (min-width:769px){
.Bnr{width:400px;margin:0 0 0 auto;}
}


.css-carousel-slider3 {
    width: 100%;
    overflow: hidden;
    position: relative;
}
.css-carousel-slider3 img {
    width: 100%;
    height: auto;
    vertical-align: top;
}

/* スライド設定 */
.css-carousel-slider3 .slide-wrap {
    width: 300%;
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    z-index: 0;
    animation: css-carousel-slider3 15s infinite;
    animation-delay: 2s;
}
.css-carousel-slider3 .slide-wrap-main {
    width: 100%;
    z-index: 1;
    animation: css-carousel-slider-main3 15s infinite;
    animation-delay: 2s;
}
.css-carousel-slider3 .slide {
    width: 100%;
}

/* スライダーアニメーションの設定 */
@keyframes css-carousel-slider3 {
    0% { transform: translateX(0); }

    27.3% { transform: translateX(calc(1 / 3 * -100%)); }
    33.3% { transform: translateX(calc(1 / 3 * -100%)); }

    60.6% { transform: translateX(calc(2 / 3 * -100%)); }
    66.6% { transform: translateX(calc(2 / 3 * -100%)); }

    94% { transform: translateX(calc(3 / 3 * -100%)); }
    100% { transform: translateX(calc(3 / 3 * -100%)); }
}

@keyframes css-carousel-slider-main3 {
    0% { transform: translateX(100%); }
    66.6% { transform: translateX(100%); }
    94% { transform: translateX(0%);}
}