@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,500,700,900);


/*** 基本指定 ***/
.wrap {width:1450px; max-width:92%; margin:0 auto;}
* {letter-spacing:.05em;}
body,select,textarea,input,div {font-family:'Noto Sans JP', "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif; font-weight:400; line-height:1.7em; font-size:16px; letter-spacing:0.1em; color: #323232;}

@media (max-width:767px) {
	body,select,textarea,input,div {font-size: 15px;}
	.flex {flex-wrap: wrap;}
}



/*** header ***/
header {padding: 20px 30px; background: #FFFFFF; position: relative;}
header * {vertical-align: text-bottom;}
header h1 {padding:5px 0; max-width:220px;}
header h1 img {line-height:1em;}
.header_wrap {display: flex; align-items:center;}
.header_menu {margin-left: auto;}
.header_menu ul {display: flex;}
.header_menu li a {display: block; padding:7px 15px; color:#333333; font-size:15px; transition:.5s;}
.header_menu li + li {border-left: 1px solid #ddd;}
.header_menu li a:hover {color:#047cd5;}
.header_menu li.contact_btn {border-left: 0; margin-left: 10px;}
.header_menu li.contact_btn a {background:#f8991d; border-radius: 100px; color: #FFFFFF; padding-left:25px; padding-right:25px;}
.header_menu li.contact_btn a:hover {background:#ff8100;}
header #openModal,
header .closeModal {display: none;}

@media (max-width:1400px) {
	.header_menu li a {padding:7px 13px;}
}

@media (max-width:1370px) {
	header {padding: 25px 25px;}
	header h1 {padding:0 0 10px; vertical-align: top;}
	.header_menu li a {padding:5px 10px;}
	.header_menu li:last-child a {padding-left:15px; padding-right:15px;}
	.header_wrap {flex-wrap: wrap;}
	.header_menu {width: 100%;}
	.header_menu li {flex-grow: 1;}
	.header_menu li a {text-align: center;}
}

@media (max-width:1080px) {
	.header_menu li a {font-size:14px;}
}

@media (max-width:939px) {
	header {padding:15px 20px;}
	header h1 {max-width:30%; padding: 0;}
	#modalArea {display: none; position: fixed; height: 100%; z-index:100; left: 0; top: 0;}
	header #openModal {margin-left: auto; cursor: pointer; display: block; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 12.5%; text-align: center; padding: 15px;}
	header #openModal img {vertical-align: middle;}
	.modalArea {display: none; position: fixed; z-index:3000; top: 0; left: 0; width: 100%; height: 100%;}
	.modalBg {width: 100%; height: 100%; background-color: rgba(66, 98, 138, 0.93);}
	.modalWrapper {position: absolute; top: 50%; left: 50%; transform:translate(-50%,-50%); width:84%;}
	header .closeModal {position: absolute; top: .5em; right: .5em; cursor: pointer; color: #fff; font-size: 2em; display: block;}
	.modalWrapper li {display: block; width: 100%;}
	.modalWrapper a  {display: block; padding:.85em 0 .65em; font-size: 1.2em; color: #FFFFFF; text-align: center; letter-spacing: .15em; transition: .5s; font-weight:300;}
	.header_menu ul {flex-wrap: wrap;}
	.header_menu li + li {border-left:0; border-top: 1px solid #aab6c2;}
	.header_menu li a {color:#fff;}
	.header_menu li a:hover {background:rgba(66, 98, 138, 0.70); color:#fff;}
	.header_menu li.contact_btn {margin-left:0; margin-top:20px; border: 0;}
	.header_menu li.contact_btn a {padding:1em 0;}
	.header_menu li a::before {top:7px;}
}

@media (max-width:767px) {
	header {padding:10px 20px;}
	.header_wrap {align-items: center; line-height: 1;}
	header * {vertical-align: middle;}
	header h1 {max-width:45%; padding: 0;}
	header h1 a {display: block;}
	header #openModal {width: 15%;}
}



/*** footer ***/
footer {padding:60px 30px 80px; background: #f7f7f7;}
.footer_wrap {text-align: center;}
.foot_logo {display: block; padding:50px 0 25px;}
.foot_logo + p {font-size:13px; line-height: 1.7em;}
footer .copy {font-size:12px; line-height: 1.6em; padding-top:20px;}

footer ul {display: flex;}
footer ul li:nth-child(1) {margin-left: auto;}
footer ul li:last-child {margin-right: auto;}
footer li a {display: block; padding:0 15px; color:#333333; font-size:13px; transition:.5s;}
footer li + li {border-left: 1px solid #ddd;}
footer li a:hover {color:#047cd5;}

@media (max-width:767px) {
	.foot_logo img {max-width:36%;}
	footer .copy {font-size:11px;}
	
	footer ul li {width: 100%;}
	footer li + li {border-left:0; border-top: 1px solid #ddd;}
	footer li a {padding:5px;}
}




/*** footer：メニュー ***/
.foot_menu {margin-left: auto; font-size: .9em;}
.foot_menu > ul {display: flex;}
.foot_menu > ul > li + li {margin-left:25px; padding-left:25px; border-left: 1px solid #e6e6e6;}
.foot_menu a {color: #333; display: inline-block; padding-left:1.1em; position: relative;}
.foot_menu a:hover {text-decoration: underline;}
.foot_menu a::before {content:"・"; position: absolute; left: 0; top: 0; color:#d0a677; font-size:13px; font-weight: 700;}




/*** HOME：メイン ***/
.top_main {position: relative;}
.top_main .full div {background-repeat: no-repeat; background-size: cover; background-position: center; height:80vh; margin: 0;}
.top_main .full div img {width: 100%; height: 100%; object-fit: cover;}

.top_main_cat {position: absolute; left:10%; top:35%; transform: translateY(-50%); width:1450px; max-width:92%; margin: auto; text-align: left;}
.top_main_cat h2 {font-weight:900; font-size:46px; line-height: 1.5em; color:#0f3a59; display: inline-block; letter-spacing: .1em; padding-bottom:10px;}
.top_main_cat p {font-weight:700; font-size: 22px; color:#0f3a59; line-height: 1.8em;}
.main_seal {position: absolute; right:0; top:0;}
.main_tool {position: absolute; right:3%; bottom:0; height:68%;}
.main_tool img {max-height: 100%;}

@media (max-width:1600px) {
	.top_main_cat {left:7%;}
	.main_tool {right:0;}
}
@media (max-width:1500px) {
	.top_main_cat {left:5%; top:25%;}
}
@media (max-width:1400px) {
	.top_main_cat h2 {font-size:40px;}
	.top_main_cat p {font-weight:700; font-size: 20px; color:#0f3a59; line-height: 1.8em;}
	.main_tool {max-width:56%; height: auto;}
}

@media (max-width:1024px) {
	.top_main .full div {height:75vh;}
	.top_main_cat {left:5%; top:20%;}
	.top_main_cat h2 {font-size:38px; padding-bottom:10px; line-height: 1.4em;}
	.top_main_cat p {font-size: 18px;}
	.main_seal {max-width: 30%;}
}

@media (max-width:768px) {
	.top_main .full div {height:55vh;}
	.top_main_cat { top:23%;}
	.top_main_cat h2 {font-size:35px;}
	.top_main_cat p {font-size: 19px;}
}

@media (max-width:767px) {
	.top_main .full div {height:60vh;}
	.top_main_cat {transform: translateY(0); top: 10%;}
	.top_main_cat h2 {font-size:21px; padding-bottom:8px;}
	.top_main_cat p {font-size:14px; line-height: 1.6em;}
	.main_seal {max-width:22%;}
	.main_tool {max-width:93%; height: auto;}
}

@media (max-width:320px) {
	.top_main .full div {height:65vh;}
}




/*** HOME：メイン：バッジ ***/
.download_btn img {max-width:190px;}
.download_btn div + div {margin-left: 15px;}



/*** HOME：メイン：スクロールボタン ***/
.fv_scroll {text-align: center; position: relative; z-index: 1; margin-top: -25px; background:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,0) 40%, #ffffff 40%, #ffffff); display: none;}
.fv_scroll a {display: inline-block; background: #047cd5; border: 3px solid #0060a7; color: #FFFFFF; padding:13px 20px; font-weight: 700; font-size: 17px; border-radius: 100px; box-shadow: 0 0 8px rgba(0,0,0,.3); transition: .5s;}
.fv_scroll a:hover {background:#ffffff; color: #047cd5;}

@media (max-width:767px) {
	.fv_scroll a {border:2px solid #047cd5; padding:10px 14px; font-size:15px;}
}




/*** 共通 ***/
.section_title {font-size: 34px; font-weight:700; color:#047cd5; text-align: center; line-height: 1.4em; padding-bottom: .8em;}

@media (max-width:768px) {
	.section_title {font-size:30px;}
}
@media (max-width:767px) {
	.section_title {font-size:22px; padding-bottom:.6em;}
}





/*** 世界初の法人ポイントプログラム ***/
.info_wrap {padding: 100px 0; background: #FFFFFF;}
.info_main {text-align: center; padding-bottom: 30px;}
.info_text {text-align: center; font-size: 1.1em; line-height: 2.3em;}

@media (max-width:767px) {
	.info_wrap {padding:50px 0;}
	.info_text {font-size:.95em; line-height:1.9em;}
	.info_text .ib {display: inline;}
}





/*** 日常的な支払いで“お得なマイル”が貯まる ***/
.get_wrap {background: #f4f6f7; padding: 110px 0;}
.get_wrap .wrap {width: 1140px;}
.get_wrap .section_title {margin-bottom: 10px;}
.get_list {display: flex; margin-bottom: 40px;}
.get_list li {width: 20%; text-align: center;}
.get_list li figure {padding: 10px 0 7px;}
.get_list li figure img {width:179px; max-width: 88%;}
.get_list li strong {font-weight: 500; font-size: 1.4em; color:#28a7e1;}
.get_list li em {font-weight: 500; font-size: 1.2em; color:#047cd5;}
.get_list li span {font-weight: 500; color:#047cd5;}

@media (max-width:768px) {
	.get_list li strong {font-size:1.3em;}
	.get_list li em {font-size:1.1em;}
	.get_list {flex-wrap: wrap; margin-bottom:10px;}
	.get_list li {width:33.33%; padding-bottom:30px;}
	.get_list li:nth-child(4) {margin-left: auto;}
	.get_list li:nth-child(5) {margin-right: auto;}
}

@media (max-width:767px) {
	.get_wrap {padding:50px 0;}
	.get_list {margin-bottom:0;}
	.get_list li {width:50%; padding-bottom:23px;}
	.get_list li figure {padding:6px 0 4px;}
	.get_list li figure img {max-width:65%;}
	.get_list li strong {font-size:1.2em;}
	.get_list li em {font-size:1em;}
	.get_list li:nth-child(5) {margin:0 auto;}
	.get_list li:nth-child(5) strong,
	.get_list li:nth-child(5) em {display: none;}
}



/*** 貯まったマイルはみんなが使える ***/
.use_wrap {padding: 100px 0 200px; background:url("../images/index/use_bottom_bg.png") repeat-x bottom center #ffffff;}
.use_main {text-align: center; padding-bottom: 30px;}
.use_text {text-align: center; font-size: 1.1em; line-height: 2.3em; word-break: normal;}

@media (max-width:767px) {
	.use_wrap {padding:50px 0 70px; background-size:100%;}
	.use_main {padding-bottom:20px;}
	.use_text {font-size:.95em; line-height:1.9em;}
	.use_text .ib {display: inline;}
}





/*** お得な活用事例 ***/
.otoku_wrap {background:#f4f6f7; background-size: cover; padding: 110px 0;}
.otoku_wrap .wrap {width: 1140px;}

.otoku_case {display: flex; margin-top:35px;}
.otoku_case li {width: 50%; padding:25px 20px; text-align: center;}
.otoku_case li + li {border-left: 1px solid #ccc;}
.otoku_case li span {display: inline-block; padding: 5px 15px; background:#7697b0; border-radius: 100px; color: #FFFFFF; margin-bottom: 15px;}
.otoku_case li > strong {display: block; color:#1874bb; font-size: 1.3em; padding: 0 0 5px 0; font-weight: 500;}
.otoku_case li p {text-align: left;}
.otoku_case li figure {padding-bottom: 10px;}
.otoku_case li figure img {max-width: 50%; width:200px;}

@media (max-width:767px) {
	.otoku_wrap {padding:60px 0 40px;}
	.otoku_case {flex-wrap: wrap;}
	.otoku_case li {width:100%; padding:25px 0; text-align: center;}
	.otoku_case li + li {border-top: 1px solid #ccc; border-left:0;}
	.otoku_case li figure img {max-width: 30%;}
}





/*** パートナー企業様へのご案内 ***/
.business_image {background: url("../images/index/business.jpg") no-repeat center; background-size: cover; position: fixed; z-index: -1; height: 100%; width: 100%; left: 0; top: 0;}
.business_wrap {background: rgba(5,23,45,.65); padding: 120px 0;}
.business_bg {}
.business_wrap .wrap {width: 1140px;}
.business_wrap * {color: #FFFFFF;}
.business_list {margin:30px auto; max-width:840px; border-top: 1px solid #768290;}
.business_list li {border-bottom: 1px solid #768290; padding: 18px 0; font-weight:500; padding-left:80px; position: relative;}
.business_list li::before {content:""; width:36px; height:36px; position: absolute; left:18px; top: 50%; margin-top: -18px; background: url("../images/index/icon_check.svg") no-repeat;}
.business_list + p {padding-bottom:35px;}

.business_wrap .info_text {line-height:2em; font-size: 1em;}

@media (max-width:767px) {
	.business_wrap {padding:70px 0;}
	.business_wrap .info_text {line-height:1.9em; font-size:.95em;}
	.business_list li {padding:15px 0; padding-left:80px; font-size: .95em;}
}





/*** たった6分でおトクな ***/
.entry_wrap {padding: 120px 0; background: #047cd5;}
.entry_wrap .wrap {width: 1140px;}
.entry_wrap .section_title {color: #FFFFFF; margin-bottom:0; padding-bottom: .55em;}
.entry_wrap .info_text {color: #FFFFFF; padding-bottom: 1.8em; line-height: 1.6em; word-break: normal;}

.entry_flex {margin: 0  50px;}
.entry_flex .entry_box {width: 50%; margin: 0 auto 30px; background:#ebf7ff; border-radius:10px; padding:30px 20px 35px; text-align: center; position: relative;}
.entry_flex .entry_box > span {font-weight: 700; font-size:22px; display: inline-block; margin-bottom: 25px; background:#047cd5; padding:0 30px 10px; border-radius: 0 0 40px 40px; color: #FFFFFF; letter-spacing: .15em;}
.entry_flex .entry_box figure {padding-bottom:25px;}
.entry_flex .entry_box h4 {font-size:26px; color:#047cd5; padding-bottom:12px; font-weight:700;}
.entry_flex .entry_box p {font-size: 1.1em;}

@media (max-width:768px) {
	.entry_wrap {padding:80px 0;}
	.entry_flex .entry_box {width: 60%;}
	.entry_flex .entry_box h4 {font-size:23px;}
	.entry_flex .entry_box figure img {max-width: 50%;}
}

@media (max-width:767px) {
	.entry_wrap {padding:50px 0;}
	.entry_flex {margin: 0 0 30px;}
	.entry_flex .entry_box {width:90%; margin:0 auto; padding:15px 10px 20px;}
	.entry_flex .entry_box > span {font-size:18px; margin-bottom:15px; padding:0 20px 8px; border-radius: 0 0 25px 25px; letter-spacing:.1em;}
	.entry_flex .entry_box figure {padding-bottom:15px;}
	.entry_flex .entry_box figure img {max-width:40%;}
	.entry_flex .entry_box + .entry_box {margin-top: 15px;}
	.entry_flex .entry_box h4 {font-size:20px; padding-bottom:8px;}
	.entry_flex .entry_box p {font-size:.9em; line-height: 1.7em;}
}



/*** たった6分でおトクな：ボタン ***/
.entry_btn {text-align: center;}
.entry_btn a {padding:23px 40px; text-align: center; margin: 0 auto; border-radius: 100px; color:#ffffff; border: 3px solid #ffffff; transition:.5s; font-weight: 700; display:inline-block;}
.entry_btn .entry_btn_form {min-width: 88%; font-size:24px; background:url("../images/index/arrow_bottom_w.png") no-repeat center 8px #f8991d;}
.entry_btn .entry_btn_form:hover {background:url("../images/index/arrow_bottom_w.png") no-repeat center 13px #ff8100;}
.entry_btn .entry_btn_download {white-space: nowrap; background:#047cd5; margin-top:25px; font-size: 21px; padding:20px 40px;}
.entry_btn .entry_btn_download:hover {background:#0060a7;}

@media (max-width:768px) {
	.entry_btn .entry_btn_form {font-size:20px;}
}

@media (max-width:767px) {
	.entry_btn .entry_btn_form {min-width:92%; font-size:18px; padding:15px 14px; background:url("../images/index/arrow_bottom_w.png") no-repeat center 5px #f8991d; letter-spacing:.03em;}
	.entry_btn .entry_btn_form:hover {background:url("../images/index/arrow_bottom_w.png") no-repeat center 10px #ff8100;}
	.entry_btn .entry_btn_download {margin-top:15px; font-size:16px; padding:10px 20px;}
}





/*** よくある質問 ***/
.qa_wrap {padding:120px 0 100px; background: #FFFFFF;}
.qa_wrap .wrap {width: 1140px;}
.qa_wrap .section_title {margin-bottom: 10px;}

.qa_tit {display: block; padding:0.5em 0.5em 0.5em 2.4em; border-radius:0.3em; cursor:pointer; font-weight:500; margin-bottom:0.7em; letter-spacing:0.05em; background:#f1f1f1; position:relative; transition:0.5s; font-size:17px; line-height: 1.7em;}
.qa_tit:hover {background:#e7eaed;}
.qa_tit::before {position:absolute; content:""; width:1.3em; height:1.3em; left:.8em; display: block; top:.1em; bottom:0; margin:auto; background:url("../images/index/icon_qa-open.svg") no-repeat center center; background-size: 90%; }

.qa_tit.active {background:#84acbb; color:#FFFFFF; }
.qa_tit.active::before {background:url("../images/index/icon_qa-close.svg") no-repeat center center; background-size:90%;}

.ac_nest {display:none;}
.qa_ans {padding:0 .5em 2em 2.5em; font-size: 15px; line-height: 2em;}
.qa_ans a {color:#f08200; text-decoration:underline; }
.qa_ans span {font-size:0.85em; display:block; line-height:1.7em; padding-top:0.6em;}

.qa_category {position: relative; padding-left: 30%; padding-bottom: 30px;}

.qa_title {padding:0; text-align: right; white-space: nowrap; position: absolute; right: 70%; top: 0;}
.qa_title h4 {display: inline-block; background: #FFFFFF; padding: 0 0 0 .5em; position: relative; font-size: 1.15em; font-weight:400; line-height: 1.6em;}
.qa_title h4::before {content:""; width: 500%; right: 0; top:.8em; height: 1px; background:#c8d2d6; z-index: -1; position: absolute;}

.qa_box {padding-left: 30px;}

@media (max-width:768px) {
	.qa_category {padding-left:0; padding-bottom: 30px;}
	.qa_title {padding:0 0 15px 0; text-align:center; white-space: nowrap; position:static; right:0; top: 0;}
	.qa_title h4 {padding:0;}
	.qa_title h4::before {display: none;}
	.qa_title h4 br {display: none;}
	.qa_box {padding-left:0;}
}
@media (max-width:767px) {
	.qa_wrap {padding:60px 0 50px;}
	.qa_tit {padding:0.5em 0.5em 0.5em 2.4em; font-weight:500; margin-bottom:0.3em; letter-spacing:.03em; font-size:15px; line-height: 1.7em;}
	.qa_title {white-space:normal; padding:0 0 10px 0;}
	.qa_title h4 {font-weight:700; font-size: 1.05em;}
	.qa_ans {font-size: 14px; line-height:1.85em;}
}