@charset "utf-8";
/*
機　　能　　名：トップページ
作　　成　　日：2019/07/30
作　　成　　者：52WEB WORKS. 関本
更　　新　　日：

/* ***************************************
	top
**************************************** */

div#top {
}
@media screen and (min-width: 769px) {/* PC */
/* main_ttl_top */
.main_ttl_top {
border-bottom:1px solid #334A66;
padding-bottom:5px;
margin-bottom:40px;
}
@media screen and (min-width: 769px) and (max-width: 1280px) {/* PC small */
.main_ttl_top img {
width:100%;
}
}
}
@media screen and (max-width: 768px) {/* SP */
/* top_nav */
.top_nav {
width:90%;
margin:0 auto 15px auto;
padding:0 5%;
border-bottom:1px solid #334A66;
text-align:center;
}
.top_nav li {
font-size:12px;
font-family:"ＭＳ Ｐ明朝","MS PMincho","Times New Roman","游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","メイリオ",Meiryo,serif;
width:20%;
}
.top_nav li a {
display:block;
padding:15px 0;
line-height:1.4;
color:#000000;
}
.top_nav .top_nav_price a {
line-height:32px;
}
.top_nav li a div {
border-right:1px solid #CCCCCC;
}
.top_nav li.lastChild a div {
border-right:none;
}

@media screen and (min-width: 480px) {/* Tablet iPad・mini */
/* main_ttl_top */
.main_ttl_top {
background:#8A0000;
}
.main_ttl_top img {
float:left;
width:50%;
}
}
}

/* ***************************************
	intro
**************************************** */
#intro {
margin-bottom:0;
}
#intro .i_01 p,
#intro .i_02 p {
text-align:center;
font-family:"ＭＳ Ｐ明朝","MS PMincho","Times New Roman","游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","メイリオ",Meiryo,serif;
}
#intro .i_01 .bg {
display:block;
background:#214572;
}
#intro .i_02 .red {
font-weight:bold;
}
#intro .i_02_in {
background:#E0D2B7;
font-family:"ＭＳ Ｐ明朝","MS PMincho","Times New Roman","游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","メイリオ",Meiryo,serif;
position:relative;
}
#intro .i_02_in img {
position:absolute;
}
#intro .i_02_in li {
background:url(../images/top/icon_check.png) 0 0 no-repeat;
}
#intro .i_03 .i_03_ttl {
background:url(../images/top/i_03_ttl_bg.png) 0 0 repeat;
padding:10px 0;
}
#intro .i_03 .i_03_ttl p {
color:#FFBF00;
font-family:"ＭＳ Ｐ明朝","MS PMincho","Times New Roman","游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","メイリオ",Meiryo,serif;
text-align:center;
line-height:1.2;
font-weight:bold;
}
#intro .i_03 h3 {
text-align:center;
}
#intro .i_03 .i_03_box {
position:relative;
color:#190066;
}
#intro .i_03 .i_03_box .i_03_box_01 {
float:left;
}
#intro .i_03 .i_03_box .i_03_box_02 {
float:right;
}
#intro .i_03 .i_03_box h4 {
font-family:"ＭＳ Ｐ明朝","MS PMincho","Times New Roman","游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","メイリオ",Meiryo,serif;
-webkit-writing-mode:vertical-rl;
-ms-writing-mode:tb-rl;
writing-mode:vertical-rl;
float:right;
}
#intro .i_03 .i_03_box p {
text-align:right;
line-height:1.4;
}
#intro .i_04 h3,
#intro .i_04 p {
text-align:center;
}
#intro .i_04 p {
font-family:"ＭＳ Ｐ明朝","MS PMincho","Times New Roman","游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","メイリオ",Meiryo,serif;
}
#intro .i_04 p .brown_bg {
color:#FFFF00;
background:#35221B;
border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;
display:inline-block;
margin-left:-2px;
}

@media screen and (min-width: 769px) {/* PC */
#intro .i_01 p {
font-size:50px;
}
#intro .bg_wrapper {
padding-top:30px;
padding-bottom:100px;
}
#intro .i_01 p .small {
font-size:40px;
}
#intro .i_01 .bg {
margin-top:20px;
}
#intro .i_02 .i_02_pop {
font-size:30px;
}
#intro .i_02 .red {
font-size:34px;
margin-bottom:17px;
}
#intro .i_02_in {
width:640px;/* total 900px */
margin:0 auto 20px auto;
font-size:20px;
padding:20px 0 0 260px;
border-radius:10px;-webkit-border-radius:10px;-moz-border-radius:10px;
}
#intro .i_02_in img {
bottom:0;
left:20px;
}
#intro .i_02_in li {
min-height:27px;
width:calc(50% - 30px);
padding-left:30px;
margin-bottom:15px;
}
#intro .i_03 {
margin-bottom:85px;
}
#intro .i_03 .i_03_ttl {
margin-bottom:40px;
}
#intro .i_03 .i_03_ttl p {
font-size:32px;
}
#intro .i_03 .i_03_box {
background:url(../images/top/i_03_box_bg_pc.png) center 81px no-repeat;
}
#intro .i_03 .i_03_box h3 {
margin-bottom:30px;
}
#intro .i_03 .i_03_box .i_03_box_in {
width:644px;/* total 717px */
margin:0 auto;
padding-left:73px;
}
#intro .i_03 .i_03_box .i_03_box_01 {
width:256px;
}
#intro .i_03 .i_03_box .i_03_box_02 {
width:283px;
}
#intro .i_03 .i_03_box .i_03_box_03 {
position:relative;
top:-20px;
width:261px;/* total 358px */
margin:0 auto 15px auto;
padding-left:103px;
}
#intro .i_03 .i_03_box h4 {
font-size:66px;
}
#intro .i_03 .i_03_box p {
font-size:16px;
}
#intro .i_03 .i_03_box .i_03_box_01 p {
width:168px;
padding-top:30px;
}
#intro .i_03 .i_03_box .i_03_box_02 p {
width:197px;
padding-top:40px;
}
#intro .i_03 .i_03_box .i_03_box_03 p {
width:180px;
padding-top:40px;
}
#intro .i_04 {
background:url(../images/top/i_04_img.png) 97px 107px no-repeat;
margin-bottom:60px;
}
#intro .i_04 h3 {
margin-bottom:24px;
}
#intro .i_04 p {
font-size:30px;
}
#intro .i_04 p .brown_bg {
font-size:40px;
border:18px solid #514036;
width:124px;
height:124px;
line-height:124px;
}
#intro .i_04 p .brown_bg1 {
margin-left:150px;
}
#intro .i_04 p .brown_bg3 {
margin-right:10px;
}
#intro .i_04 p .red_bg {
width:360px;
display:block;
margin:28px auto 19px auto;
}
}
@media screen and (min-width: 769px) and (max-width: 1280px) {/* PC small */
#intro .i_01 .bg img {
width:100%;
}
}
@media screen and (min-width: 769px) and (max-width: 1024px) {/* Tablet iPad Pro */
}

@media screen and (max-width: 768px) {/* SP */
#intro .i_01 p {
font-size:25px;
}
#intro .bg_wrapper {
padding-top:22px;
padding-bottom:30px;
}
#intro .i_01 .small {
font-size:20px;
}
#intro .i_01 .bg {
margin-top:15px;
}
#intro .i_02 {
margin-bottom:10px;
}
#intro .i_02 p {
font-size:15px;
}
#intro .i_02 .red {
line-height:1.6;
}
#intro .i_02 p .red_bg {
line-height:1;
}
#intro .i_02_in {
width:90%;/* total 96% */
margin:100px auto 0 auto;
padding:3% 3% 1% 3%;
font-size:10px;
border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;
}
#intro .i_02_in img {
width:117px;
margin:0 auto;
display:block;
top:-98px;
left:50%;
margin-left:-59px;
}
#intro .i_02_in li {
min-height:10px;
width:calc(50% - 15px);
padding-left:15px;
margin-bottom:8px;
background-size:auto 10px;
-webkit-background-size:auto 10px;
}
#intro .i_03 {
margin-bottom:26px;
}
#intro .i_03 .i_03_ttl {
margin-bottom:24px;
background-size:auto 50%;
-webkit-background-size:auto 50%;
}
#intro .i_03 .i_03_ttl p {
font-size:14px;
letter-spacing:-1px;
}
#intro .i_03 .i_03_box {
width:320px;
margin:0 auto;
}
#intro .i_03 .i_03_box .i_03_box_bg4 {
width:136px;
position:absolute;
top:170px;
left:5px;
z-index:6;
}
#intro .i_03 .i_03_box h3 {
margin:0 3% 20px 3%;
}
#intro .i_03 .i_03_box_in {
position:relative;
}
#intro .i_03 .i_03_box .i_03_box_01 {
width:120px;/* total 160px */
height:113px;/* total 143px */
padding:30px 25px 0 15px;
position:relative;
z-index:1;
background:url(../images/top/i_03_box_bg1_sp.png) center 0 no-repeat;
background-size:auto 143px;
-webkit-background-size:auto 143px;
}
#intro .i_03 .i_03_box .i_03_box_02 {
width:125px;/* total 160px */
height:128px;/* total 148px */
padding:20px 15px 0 20px;
position:absolute;
top:-20px;
right:-5px;
z-index:1;
background:url(../images/top/i_03_box_bg2_sp.png) 0 0 no-repeat;
background-size:auto 148px;
-webkit-background-size:auto 148px;
}
#intro .i_03 .i_03_box .i_03_box_03 {
width:131px;/* total 156px */
height:105px;/* total 145px */
padding:40px 15px 0 10px;
margin:0 0 0px 110px;
position:relative;
top:-70px;
z-index:2;
background:url(../images/top/i_03_box_bg3_sp.png) 0 bottom no-repeat;
background-size:auto 145px;
-webkit-background-size:auto 145px;
}
#intro .i_03 .i_03_box h4 {
font-size:33px;
}
#intro .i_03 .i_03_box p {
font-size:9px;
}
#intro .i_03 .i_03_box a {
position:relative;
top:-80px;
z-index:4;
font-size:11px;
}
#intro .i_03 .i_03_box .i_03_box_01 p {
width:80px;
}
#intro .i_03 .i_03_box .i_03_box_02 p {
width:110px;
padding-top:10px;
}
#intro .i_03 .i_03_box .i_03_box_03 p {
width:100px;
}
#intro .i_04 {
margin-top:-70px;
margin-bottom:22px;
background:url(../images/top/i_04_img.png) 15px 54px no-repeat;
background-size:60px auto;
-webkit-background-size:60px auto;
}
#intro .i_04 h3 {
margin-bottom:25px;
}
#intro .i_04 p {
font-size:13px;
}
#intro .i_04 p .brown_bg {
font-size:17px;
border:8px solid #514036;
width:54px;
height:54px;
line-height:54px;
margin-bottom:5px;
}
#intro .i_04 p .brown_bg1 {
margin-left:60px;
}
#intro .i_04 p .red_bg {
margin:10px auto;
}
#intro .i_04 p img {
width:90%;
}
@media screen and (min-width: 480px) {/* Tablet iPad・mini */
#intro .i_03 .i_03_box a {
width:80%;
}
}
@media screen and (max-width: 320px) {/* iphoneSE */
#intro .i_01 p {
font-size:23px;
}
#intro .i_01 .small {
font-size:16px;
}
#intro .i_03 .i_03_box {
width:280px;
}
#intro .i_03 .i_03_ttl p {
font-size:12px;
}
#intro .i_03 .i_03_box .i_03_box_bg4 {
top:210px;
width:120px;
}
#intro .i_03 .i_03_box .i_03_box_01 {
width:120px;/* total 155px */
height:108px;/* total 138px */
padding:30px 35px 0 0;
background-size:auto 138px;
-webkit-background-size:auto 138px;
}
#intro .i_03 .i_03_box .i_03_box_02 {
width:135px;/* total 165px */
height:118px;/* total 158px */
padding:40px 10px 0 20px;
background-size:auto 158px;
-webkit-background-size:auto 158px;
}
#intro .i_03 .i_03_box .i_03_box_03 {
width:121px;/* total 146px */
height:110px;/* total 135px */
padding-top:25px;
margin:0 0 50px 75px;
top:-50px;
background-size:auto 135px;
-webkit-background-size:auto 135px;
}
#intro .i_03 .i_03_box h4 {
font-size:28px;
}
#intro .i_03 .i_03_box .i_03_box_01 p {
width:90px;
}
#intro .i_03 .i_03_box .i_03_box_02 p {
width:120px;
padding-top:0;
}
#intro .i_03 .i_03_box .i_03_box_03 p {
width:100px;
}
#intro .i_04 {
background:url(../images/top/i_04_img.png) 5px 54px no-repeat;
background-size:60px auto;
-webkit-background-size:60px auto;
}
}
}

/* ***************************************
	point
**************************************** */
#point {
}
#point .p_box {
margin:0 auto;
}
#point h3 {
position:relative;
background:#8A0000;
color:#FFF;
text-align:center;
font-weight:normal;
font-family:"ＭＳ Ｐ明朝","MS PMincho","Times New Roman","游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","メイリオ",Meiryo,serif;
}
#point h3 img {
position:absolute;
left:50%;
}
#point .p_01 li {
font-weight:bold;
position:relative;
}
#point .p_01 li dt {
color:#FFFFFF;
float:left;
}
#point .p_01 li dd {
color:#FFFF00;
float:left;
}
#point .p_01 li dd .tax {
font-weight:normal;
position:absolute;
}
#point .p_01_btm .p_01_btm_r .p_01_bg3 {
color:#FFFFFF;
font-weight:bold;
}
#point .p_01_btm .p_01_btm_r .p_01_bg3 {
float:left;
}
#point .p_01_btm .p_01_btm_r .p_01_bg3 p {
text-align:center;
line-height:1.2;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt strong {
display:block;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt p .red {
font-weight:bold;
}
#point .p_02_in {
margin:0 auto;
}
#point .p_02_in .txt_blue {
text-shadow:none;
filter:drop-shadow(0px 0px 0px rgba(0,0,0,0));
}
#point .p_02_in .txt_yellow {
filter:drop-shadow(0px 0px 0px rgba(0,0,0,0));
}
@media screen and (min-width: 769px) {/* PC */
#point {
padding-top:108px;
}
#point .p_box {
width:900px;
}
#point .p_01 {
margin-bottom:130px;
}
#point h3 {
font-size:34px;
height:120px;
line-height:120px;
margin-bottom:40px;
}
#point h3 span {
font-size:60px;
}
#point h3 span span {
font-size:46px;
}
#point h3 img {
top:-29px;
margin-left:-290px;
}
#point .p_01 ul {
margin-bottom:40px;
}
#point .p_01 li {
width:388px;/* total 434px */
height:70px;/* total 95px */
padding:25px 23px 0 23px;
}
#point .p_01 li dt {
width:140px;
}
#point .p_01 li dd {
width:248px;
font-size:50px;
}
#point .p_01 li dd .yen {
font-size:26px;
}
#point .p_01 li dd .tax {
font-size:12px;
top:25px;
right:40px;
}
#point .p_01 .p_01_bg1 {
font-size:22px;
background:url(../images/top/p_01_bg1_pc.png) 0 0 no-repeat;
}
#point .p_01 .p_01_bg2 {
font-size:20px;
float:right;
background:url(../images/top/p_01_bg2_pc.png) 0 0 no-repeat;
}
#point .p_01 .p_01_bg1 dt {
padding-top:15px;
}
#point .p_01 .p_01_bg2 dt {
padding-top:7px;
}
#point .p_01_btm {
margin-bottom:50px;
}
#point .p_01_btm .p_01_btm_l {
float:left;
width:452px;
}
#point .p_01_btm .p_01_btm_r {
float:right;
width:430px;
}
#point .p_01_btm .p_01_btm_r .p_01_bg3 {
width:167px;
height:54px;/* total 62px */
font-size:20px;
padding-top:8px;
background:url(../images/top/p_01_bg3_pc.png) 0 0 no-repeat;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt {
float:right;
width:245px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt p {
font-size:14px;
line-height:1.4;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt strong {
font-size:22px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt p .tax {
font-size:10px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt p .red {
font-size:25px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt p .red span {
font-size:17px;
}
#point .p_box .gray_btn {
width:600px;
}
#point .p_02_in {
width:760px;/* total 810px */
margin:24px auto 20px auto;
padding:17px 0 0 50px;
position:relative;
background:url(../images/top/p_02_in_bg.png) right 19px top 0 no-repeat;
}
#point .p_02_in img {
position:absolute;
top:0;
left:0;
}
#point .p_02_in .red_bg {
font-size:40px;
}
#point .p_02_in .red_bg .small {
font-size:30px;
}
#point .p_02_in .txt_yellow {
font-size:80px;
}
}
@media screen and (min-width: 769px) and (max-width: 1280px) {/* PC small */
}
@media screen and (min-width: 769px) and (max-width: 1024px) {/* Tablet iPad Pro */
}

@media screen and (max-width: 768px) {/* SP */
#point {
padding-top:35px;
}
#point .p_box {
width:90%;
}
#point .p_01 {
margin-bottom:65px;
}
#point h3 {
font-size:17px;
padding:13px 0;
line-height:1.2;
margin-bottom:20px;
}
#point h3 span {
font-size:30px;
}
#point h3 span span {
font-size:23px;
}
#point h3 img {
top:-12px;
width:290px;
margin-left:-145px;
}
#point .p_01 ul {
width:253px;
margin:0 auto 20px auto;
}
#point .p_01 li {
width:calc(100% - 30px);
height:55px;/* total 55px */
padding:0 15px;
}
#point .p_01 li dt {
width:35%;
}
#point .p_01 li dd {
width:55%;
font-size:28px;
}
#point .p_01 li dd .yen {
font-size:16px;
}
#point .p_01 li dd .tax {
font-size:10px;
top:28px;
right:18px;
}
#point .p_01 .p_01_bg1 {
font-size:14px;
margin-bottom:20px;
background:url(../images/top/p_01_bg1_sp.png) center 0 no-repeat;
background-size:auto 55px;
-webkit-background-size:auto 55px;
}
#point .p_01 .p_01_bg2 {
font-size:12px;
float:right;
background:url(../images/top/p_01_bg2_sp.png) center 0 no-repeat;
background-size:auto 55px;
-webkit-background-size:auto 55px;
}
#point .p_01 .p_01_bg1 dt {
padding-top:20px;
}
#point .p_01 .p_01_bg2 dt {
padding-top:15px;
}
#point .p_01 .p_01_bg1 dd {
padding-top:13px;
}
#point .p_01 .p_01_bg2 dd {
padding-top:13px;
}
#point .p_01_btm {
margin-bottom:12px;
}
#point .p_01_btm .p_01_btm_l {
margin-bottom:15px;
}
#point .p_01_btm .p_01_btm_r .p_01_bg3 {
width:116px;
height:38px;/* total 41px */
padding-top:3px;
font-size:14px;
margin-top:3px;
background:url(../images/top/p_01_bg3_sp.png) 0 0 no-repeat;
background-size:auto 41px;
-webkit-background-size:auto 41px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt p {
font-size:12px;
line-height:1.2;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt strong {
font-size:17px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt p .tax {
font-size:10px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt p .red {
font-size:18px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt p .red span {
font-size:12px;
}
#point .p_02_in {
margin:30px auto 10px auto;
padding:35px 0 0 0;
position:relative;
background:url(../images/top/p_02_in_bg.png) right 0 no-repeat;
background-size:127px auto;
-webkit-background-size:127px auto;
}
#point .p_02_in img {
position:absolute;
top:0;
left:0;
width:40px;
}
#point .p_02_in .red_bg {
font-size:16px;
padding:2px;
width:60%;
text-align:center;
margin:0;
}
#point .p_02_in .red_bg .small {
font-size:12px;
}
#point .p_02_in .txt_blue {
font-size:18px;
}
#point .p_02_in .txt_yellow {
font-size:24px;
}
@media screen and (min-width: 480px) {/* Tablet iPad・mini */
#point .p_01 ul {
width:100%;
}
#point .p_01 li {
width:43%;
height:80px;
margin-bottom:0 !important;
}
#point .p_01 .p_01_bg1 {
background:url(../images/top/p_01_bg1_pc.png) center 0 no-repeat;
background-size:100% 100%;
-webkit-background-size:100% 100%;
}
#point .p_01 .p_01_bg2 {
background:url(../images/top/p_01_bg2_pc.png) center 0 no-repeat;
background-size:100% 100%;
-webkit-background-size:100% 100%;
}
#point .p_01 .p_01_bg1 dt {
padding-top:35px;
width:30%;
}
#point .p_01 .p_01_bg2 dt {
padding-top:25px;
line-height:1.2;
width:30%;
}
#point .p_01 .p_01_bg1 dd,
#point .p_01 .p_01_bg2 dd {
padding-top:25px;
font-size:30px;
width:65%;
}
#point .p_01 li dd .tax {
top:38px;
right:35px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt p {
line-height:41px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt strong {
display:inline-block;
margin-right:10px;
}
#point .p_02_in {
width:50%;
}
}
@media screen and (max-width: 320px) {/* iphoneSE */
#point h3 img {
width:250px;
margin-left:-125px;
}
#point .p_01 ul {
width:207px;
}
#point .p_01 li {
width:calc(100% - 20px);
height:45px;/* total 45px */
padding:0 10px;
}
#point .p_01 li dt {
width:35%;
}
#point .p_01 li dd {
width:55%;
font-size:20px;
}
#point .p_01 li dd .yen {
font-size:16px;
}
#point .p_01 li dd .tax {
top:20px;
right:5px;
}
#point .p_01 .p_01_bg1 {
font-size:12px;
background-size:auto 45px;
-webkit-background-size:auto 45px;
}
#point .p_01 .p_01_bg2 {
font-size:10px;
background-size:auto 45px;
-webkit-background-size:auto 45px;
}
#point .p_01 .p_01_bg1 dt {
padding-top:18px;
}
#point .p_01 .p_01_bg2 dt {
padding-top:13px;
}
#point .p_01_btm .p_01_btm_r .p_01_bg3 {
width:104px;
height:33px;/* total 38px */
padding-top:5px;
margin-top:0;
margin-right:5px;
font-size:12px;
background-size:auto 38px;
-webkit-background-size:auto 38px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt p {
font-size:10px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt strong {
font-size:15px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt p .red {
font-size:16px;
}
#point .p_01_btm .p_01_btm_r .p_01_btm_txt p .red span {
font-size:10px;
}
#point .p_02_in .txt_blue {
font-size:16px;
}
}
}

/* ***************************************
	promise
**************************************** */
#promise {
}
#promise h3 {
text-align:center;
background:url(../images/common/ttl_bg1.png) 0 bottom repeat-x;
}
#promise h3 img {
display:block;
margin:0 auto;
}
#promise .pr_box h4 {
text-align:center;
color:#BA0000;
}
#promise .pr_box h4 img {
vertical-align:middle;
}
#promise .pr_box .att {
color:#DF0000;
}
@media screen and (min-width: 769px) {/* PC */
#promise h3 {
font-size:60px;
width:807px;
margin:0 auto 40px auto;
padding-bottom:30px;
}
#promise h3 img {
width:398px;
margin-bottom:10px;
}
#promise h3 span {
font-size:50px;
}
#promise .pr_box {
width:775px;/* total 900px */
height:198px;/* total 248px */
padding:50px 60px 0 65px;
margin:0 auto 6px auto;
background:url(../images/top/pr_bg_pc.png) 0 0 no-repeat;
}
#promise .pr_box3 {
height:208px;/* total 248px */
padding-top:40px;
margin-bottom:60px;
}
#promise .pr_box h4 {
font-size:46px;
margin-bottom:20px;
line-height:65px;
height:65px;
}
#promise .pr_box h4 img {
margin-right:15px;
}
#promise .pr_box h4 span {
font-size:36px;
}
#promise .gray_btn {
width:600px;
}
}
@media screen and (min-width: 769px) and (max-width: 1280px) {/* PC small */
}
@media screen and (min-width: 769px) and (max-width: 1024px) {/* Tablet iPad Pro */
}

@media screen and (max-width: 768px) {/* SP */
#promise h3 {
font-size:30px;
margin:0 auto 20px auto;
padding-bottom:15px;
background-size:auto 9px;
-webkit-background-size:auto 9px;
}
#promise h3 img {
margin-bottom:5px;
}
#promise h3 span {
font-size:25px;
}
#promise .pr_box {
margin-bottom:30px;
}
#promise .pr_box_in {
width:auto;
margin-bottom:20px;
position:relative;
background:url(../images/top/pr_bg_sp.png) 0 0 no-repeat;
background-size:100% 88px;
-webkit-background-size:100% 88px;
}
#promise .pr_box1 .pr_box_in {
height:88px;
line-height:88px;
}
#promise .pr_box2 .pr_box_in {
height:68px;/* total 88px */
padding-top:20px;
line-height:1.1;
}
#promise .pr_box3 .pr_box_in {
height:71px;/* total 88px */
padding-top:17px;
line-height:1.1;
}
#promise .pr_box h4 {
font-size:22px;
padding-left:40px;
}
#promise .pr_box h4 img {
width:32px;
margin-right:5px;
position:absolute;
top:50%;
left:7%;
margin-top:-16px;
}
#promise .pr_box h4 span {
font-size:18px;
}
@media screen and (min-width: 480px) {/* Tablet iPad・mini */
#promise h3 img {
width:50%;
}
#promise .pr_box_in {
width:70%;
margin:0 auto;
}
}
@media screen and (max-width: 320px) {/* iphoneSE */
#promise .pr_box h4 {
font-size:20px;
}
#promise .pr_box h4 span {
font-size:16px;
}
}
}

/* ***************************************
	flow
**************************************** */
#flow {
}
#flow .f_intro {
position:relative;
}
#flow .f_intro:before,
#flow .f_intro:after {
content:"";
position:absolute;
display:block;
}
#flow .f_intro:before {
left:0;
background:url(../images/top/f_l.png) 0 0 no-repeat;
}
#flow .f_intro:after {
right:0;
background:url(../images/top/f_r.png) 0 0 no-repeat;
}
#flow .f_intro p {
text-align:center;
}
#flow .f_intro .mincho {
color:#1F3D8C;
}
#flow .f_box {
margin:0 auto;
}
#flow .f_box_in {
width:25%;
float:left;
}
#flow .f_box h4 {
font-family:"ＭＳ Ｐ明朝","MS PMincho","Times New Roman","游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","メイリオ",Meiryo,serif;
}
#flow .f_box h4 span {
color:#E0D2B7;
background:#000;
display:inline-block;
text-align:center;
border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;
}
#flow .f_card {
font-family:"ＭＳ Ｐ明朝","MS PMincho","Times New Roman","游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","メイリオ",Meiryo,serif;
background:#EEEEEE;
margin:0 auto;
}
@media screen and (min-width: 769px) {/* PC */
#flow .f_intro {
width:796px;
margin:0 auto 27px auto;
}
#flow .f_intro:before,
#flow .f_intro:after {
top:40px;
width:60px;
height:81px;
}
#flow .f_intro .txt_blue {
font-size:50px;
}
#flow .f_intro .txt_blue .big {
font-size:60px;
}
#flow .f_intro .txt_yellow {
font-size:100px;
}
#flow .f_intro .mincho {
font-size:30px;
position:relative;
top:-40px;
}
#flow .f_box {
width:900px;
}
#flow .f_box h4 {
font-size:34px;
padding-left:10px;
margin-bottom:10px;
}
#flow .f_box1 h4 {
padding-left:0;
}
#flow .f_box h4 span {
font-size:27px;
margin-right:10px;
width:40px;
height:40px;
line-height:40px;
}
#flow .f_card {
width:858px;/* total 900px */
height:74px;
padding:0 20px 0 22px;
position:relative;
}
#flow .f_card p {
font-size:18px;
line-height:74px;
}
#flow .f_card img {
position:absolute;
top:18px;
right:20px;
}
}
@media screen and (min-width: 769px) and (max-width: 1280px) {/* PC small */
}
@media screen and (min-width: 769px) and (max-width: 1024px) {/* Tablet iPad Pro */
}

@media screen and (max-width: 768px) {/* SP */
#flow .f_intro {
width:98%;
margin:0 auto 20px auto;
}
#flow .f_intro:before,
#flow .f_intro:after {
top:8px;
width:24px;
height:33px;
background-size:auto 33px;
-webkit-background-size:auto 33px;
}
#flow .f_intro .txt_blue {
font-size:20px;
}
#flow .f_intro .txt_blue .big {
font-size:25px;
}
#flow .f_intro .txt_yellow {
font-size:30px;
}
#flow .f_intro .mincho {
font-size:12px;
}
#flow .f_box {
width:94%;
}
#flow .f_box h4 {
font-size:13px;
padding-left:2px;
margin-bottom:2px;
}
#flow .f_box1 h4 {
padding-left:0;
}
#flow .f_box h4 span {
font-size:12px;
margin-right:2px;
width:15px;
height:15px;
line-height:15px;
}
#flow .f_card {
padding:13px;
width:calc(94% - 26px);
}
#flow .f_card p {
text-align:center;
}
#flow .f_card img {
width:111px;
display:block;
margin:6px auto 0 auto;
}
@media screen and (min-width: 480px) {/* Tablet iPad・mini */
#flow .f_intro {
width:50%;
}
#flow .f_card {
width:calc(54% - 26px);
}
}
@media screen and (max-width: 320px) {/* iphoneSE */
#flow .f_intro .txt_blue {
font-size:18px;
}
#flow .f_intro .txt_blue .big {
font-size:22px;
}
#flow .f_intro .txt_yellow {
font-size:27px;
}
#flow .f_box h4 {
font-size:11px;
}
#flow .f_box h4 span {
font-size:10px;
}
}
}

/* ***************************************
	area
**************************************** */
#area {
margin:0 auto;
padding-bottom:80px;
}
#area .a_ttl {
font-family:"ＭＳ Ｐ明朝","MS PMincho","Times New Roman","游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","メイリオ",Meiryo,serif;
font-weight:bold;
}
#area .info_memo .info_memo_in {
display:block;
position:relative;
text-align:center;
}
@media screen and (min-width: 769px) {/* PC */
#area {
width:900px;
padding-top:40px;
background:url(../images/top/a_bg_pc.png) center 0 no-repeat;
}
#area .clearfix {
padding-left:88px;
}
#area .a_ttl {
font-size:34px;
float:left;
width:340px;
padding-top:10px;
line-height:1.2;
text-align:right;
}
#area .a_ttl .red {
font-size:66px;
text-shadow:
#FFF 3px 0px,  #FFF -3px 0px,
#FFF 0px -3px, #FFF 0px 3px,
#FFF 3px 3px , #FFF -3px 3px,
#FFF 3px -3px, #FFF -3px -3px,
#FFF 1px 3px,  #FFF -1px 3px,
#FFF 1px -3px, #FFF -1px -3px,
#FFF 3px 1px,  #FFF -3px 1px,
#FFF 3px -1px, #FFF -3px -1px;
}
#area .a_ttl .big {
font-size:46px;
}
#area .a_ttl .small {
font-size:20px;
display:block;
text-align:left;
padding-left:55px;
}
#area .info_memo {
font-size:33px;
float:left;
width:270px;
margin-left:25px;
}
#area .info_memo .info_memo_in {
margin-bottom:7px;
padding:12px 10px;
}
#area .info_memo .info_memo_in:before {
content:"";
position:absolute;
top:50%;
left:-24px;
margin-top:-12px;
border:12px solid transparent;
border-right:12px solid #FFDC73;
z-index:2;
}
#area .info_memo .info_memo_in:after {
content:"";
position:absolute;
top:50%;
left:-32px;
margin-top:-14px;
border:14px solid transparent;
border-right:14px solid #BA0000;
z-index:1;
}
#area .a_memo {
margin:0 0 70px 260px;
}
#area .gray_btn {
width:600px;
}
}
@media screen and (min-width: 769px) and (max-width: 1280px) {/* PC small */
}
@media screen and (min-width: 769px) and (max-width: 1024px) {/* Tablet iPad Pro */
}

@media screen and (max-width: 768px) {/* SP */
#area {
width:90%;
padding-top:15px;
background:url(../images/top/a_bg_sp.png) 0 0 no-repeat;
background-size:139px auto;
-webkit-background-size:139px auto;
}
#area .a_ttl {
position:relative;
font-size:12px;
line-height:1.2;
text-align:center;
}
#area .a_ttl .red {
font-size:28px;
text-shadow:
#FFF 1.5px 0px,  #FFF -1.5px 0px,
#FFF 0px -1.5px, #FFF 0px 1.5px,
#FFF 1.5px 1.5px , #FFF -1.5px 1.5px,
#FFF 1.5px -1.5px, #FFF -1.5px -1.5px,
#FFF 1px 1.5px,  #FFF -1px 1.5px,
#FFF 1px -1.5px, #FFF -1px -1.5px,
#FFF 1.5px 1px,  #FFF -1.5px 1px,
#FFF 1.5px -1px, #FFF -1.5px -1px;
}
#area .a_ttl .big {
font-size:20px;
}
#area .a_ttl .small {
font-size:10px;
display:block;
margin-left:100px;
position:relative;
top:-38px;
}
#area .info_memo {
margin-left:150px;
margin-bottom:17px;
}
#area .info_memo .info_memo_in {
margin-bottom:5px;
}
#area .a_memo {
font-size:12px;
margin:0 0 20px 90px;
}
@media screen and (min-width: 480px) {/* Tablet iPad・mini */
#area {
width:50%;
}
#area .gray_btn {
width:80%;
}
}
@media screen and (max-width: 320px) {/* iphoneSE */
}
}