@charset "UTF-8";

/* =======================================================================

CSSの名前：eposcard.css 

最終更新日時：2021/05/25

--------------------------------------------------------------------------

eposcard用スタイル

======================================================================= */


/* =========▽crearFix========= */
div:after,
 {
    content: "";
    display: block;
    clear: both;
}

.flex{display:flex;}

/* For modern browsers */
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
 
.cf:after {
    clear: both;
}
 
/* For IE 6/7 only */
.cf {
    *zoom: 1;
}


/* =========△crearFix========= */
#jsContents{background: #f1f4f8;padding:0;font-family: sans-serif;}

#jsContents h1{width: 1095px; margin:0 auto 30px!important;padding:30px 0 0;}
#jsContents h2{font-size:30px!important;text-align: center;font-weight: 600;}
#jsContents h3{text-align: center;font-size:3.2em;clear:both;margin: 0;font-weight: 600;}

#jsContents p{font-size:16px;line-height:1.5em;}
#jsContents p+p{margin-top:10px; }
#jsContents .small{font-size:14px!important;	}	
#jsContents .note{font-size:14px!important;}
#jsContents .big{font-size:20px;}
#jsContents .red{color:#CC0000;}
#jsContents img{vertical-align: bottom;}
#jsContents .txR{text-align: right!important;}
#jsContents  a:link{text-decoration: none!important;}
#jsContents .indent-1-5 {padding-left:1.5em;text-indent:-1.5em;}
#jsContents .flex{display: flex;}


.wBase{width:100%;background: #fff;padding:100px 0 70px;}
.wBase .readTxt{width:820px!important;text-align:left;}

.eposInner{width: 1055px!important;margin:0 auto;font-size:62.5%!important;margin-bottom: 0;box-sizing: border-box;}
.readTxt{width:850px!important; margin:20px auto 40px;padding:0; text-align:center;}

/* =========特典========= */
.tokutenBox{width:486px;box-sizing: border-box;margin: 50px 20px 0;}
.tokutenBoxInner{height: 320px!important; border: 3px solid #d0352c;background: #fff;border-top: none;text-align: center;padding: 20px 13px;}
.tokutenBoxInner p{font-size: 18px!important;margin-bottom: 15px;font-weight: 500;}


/* =========BTNエリア========= */
.bgPpl{width:100%;background: #7c266e;padding:25px 0;text-align: center;box-sizing: border-box;}
.btnEpos{font-family: sans-serif;font-weight: 500;width:875px;height: 95px;margin: 0 auto; background-color:#fff;background-image: url("../images/detail/eposcard/logo_epos.png");background-repeat: no-repeat;background-position: 50px 23px; border-radius:50px;font-size: 3.4em; color:#CC0000;padding:22px 0 0 140px;box-sizing: border-box;border: 2px solid #fff;}
a:hover .btnEpos{border: 2px solid #CC0000;background-color: #f0f0f0;}

.btnHatena{display: block; width:360px;height: 50px;margin: 15px 40px 0!important; background-color:#e1e3e6;background-image: url("../images/detail/eposcard/icon_hatena.png");background-repeat: no-repeat;background-position: 10px 6px; border-radius:50px;font-size: 2.1em; color:#333;padding:7px 0 0 20px;box-sizing: border-box;border: 2px solid #e1e3e6;}
a:hover .btnHatena{border: 2px solid #CC0000;background-color: #f0f0f0;}


/* =========BG白========= */
.bgWht{width:100%;background: #fff;padding:70px 0 60px;text-align: center;box-sizing: border-box;}
.wBg{display: block; width:1055px; border-radius: 10px;padding:30px 50px 50px!important;margin: 50px auto 50px!important;background: #FFF;text-align: left;box-sizing: border-box;}

/* =========エポスかんたん決済とは========= */
.aboutBox{width:315px;height:210px;border:3px solid #44a1b1;box-sizing: border-box;padding:20px 5px 10px 10px;border-radius: 8px;margin: 30px 10px 0;}
.aboutBox h4{text-align: center;color:#44a1b1;margin:15px 0 0!important;font-size: 1.8em;line-height: 1.3; font-weight: 500;text-align: left;}


.flowBox{width:300px;height:300px;box-sizing: border-box;padding:180px 10px 10px;margin: 0 10px;}
.bg01{background: url("../images/detail/eposcard/circle01.png")no-repeat center 20px;}
.bg02{background: url("../images/detail/eposcard/circle02.png")no-repeat center 20px;}
.bg03{background: url("../images/detail/eposcard/circle03.png")no-repeat center 20px;}
.flowBox h4{text-align: center;color:#44a1b1;margin-bottom: 0;font-size: 2.2em;font-weight: 700;}


.gBg{background: #ebf9f0;width:850px;margin:10px auto 0;padding:40px;text-align: center;border-radius: 8px;}

.flowTable{width:900px!important;margin: 80px auto 20px;border:3px solid #e3f1f3;}
.flowTable td p{font-size:14px!important;}
.flowTable h4{font-size: 20px;font-weight: 500;color:#44a1b1;margin-top: 15px;}
.flowTable th{width:220px;padding:0 10px 0;}
.flowTable td{padding:0 20px 25px 0;}
.flowTable tr:nth-child(even){background: #e3f1f3;}
.flowTriangle_S{margin:0 0 0 50px; width: 0; height: 0; border-left: 40px solid transparent; border-right: 40px solid transparent; border-top: 20px solid #e3f1f3;}
.flowTable tr:nth-child(even) .flowTriangle_S{border-top: 20px solid #fff;}

/* 利用方法
-------------------------------------------------------------*/
.howtoBox{border:1px solid #abacac;width:750px;text-align: center;margin: 0 auto;padding: 0 0 50px;}

.howtoBox p{margin-top: 20px;}
.howtoBox h4{float:right;display: block; width:640px;text-align:left;height:70px;font-size:2.4em;color:#c1875f;padding:20px 0 0 0;font-weight: 600;}
.flowTriangle{margin:30px auto; width: 0; height: 0; border-left: 70px solid transparent; border-right: 70px solid transparent; border-top: 40px solid #c1875f;}
img.border{border: 1px solid #CCC;}



/* 注意書き
-------------------------------------------------------------*/		
	
#jsContents ul.notice{margin:20px 20px 0;text-align: left;}
#jsContents ul.notice li{margin:10px 0 0;font-size:14px;line-height:1.4em;list-style-type:none;text-indent: -1.5em;}
#jsContents ul.notice li.num{padding-left:1em;text-indent: -2.5em;}
#jsContents ul.notice li:before {display: inline;	font-weight:bold;content: "※ ";}	


/* 問い合わせ
-------------------------------------------------------------*/		
.borderBox{width:500px;height:500px;border:1px solid #555;padding:10px;margin:30px 13px 50px;}
.borderBox h5{font-size:1.8em;font-weight:bold;background: #eee;padding:7px!important;}