@charset "UTF-8";
@font-face {
	font-family: "Montserrat";
	font-weight: 400;
	font-display: swap;
	src: url("../webfonts/Montserrat-Regular.ttf") format("TrueType");
}
@font-face {
	font-family: "Montserrat";
	font-weight: 600;
	font-display: swap;
	src: url("../webfonts/Montserrat-Bold.ttf") format("TrueType");
}
@font-face {
	font-family: "Noto Sans JP";
	font-weight: 400;
	font-display: swap;
	src: url("../webfonts/NotoSansJP-Regular.ttf") format("TrueType");
}
@font-face {
	font-family: "Noto Sans JP";
	font-weight: 600;
	font-display: swap;
	src: url("../webfonts/NotoSansJP-Bold.ttf") format("TrueType");
}
@font-face {
	font-family: "Outfit";
	font-weight: 400;
	font-display: swap;
	src: url("../webfonts/Outfit-Regular.ttf") format("TrueType");
}
@font-face {
	font-family: "Outfit";
	font-weight: 600;
	font-display: swap;
	src: url("../webfonts/Outfit-Bold.ttf") format("TrueType");
}
@font-face {
	font-family: "Poppins";
	font-weight: 400;
	font-display: swap;
	src: url("../webfonts/Poppins-Regular.ttf") format("TrueType");
	unicode-range: U+0030-0039;
}
@font-face {
	font-family: "Poppins";
	font-weight: 600;
	font-display: swap;
	src: url("../webfonts/Poppins-Bold.ttf") format("TrueType");
	unicode-range: U+0030-0039;
}
/*base*/
* {
	margin:0px;
	padding:0px;
	font-style:normal;
	box-sizing: border-box;
}

body {
	font-family: "Poppins", "Outfit", "Noto Sans JP", "Hiragino Kaku Gothic Pro", Meiryo, "MS PGothic", sans-serif;
	line-height: 1.5;
	min-width: 1000px;
}

a {
	color: #000000;
	text-decoration: none;
}

a:hover {
	text-decoration: none;
}

ul li {
	list-style-type:none;
	list-style-position:outside;
}

b {
	font-weight: bold;
}

.sp {
    display: none;
}

main.page{
	padding-top: 117px;
}

.text-center, .textCenter {
	text-align: center!important;
}

.text-right, .textRight {
	text-align: right!important;
}

.container {
	width: 1100px;
	margin: 0 auto;
	/* overflow: hidden; */
	font-size: 16px;
}

.header .container div.logo p{
    font-size: 10.5px;
    margin-top: 5px;
}

.containerType1 {
	padding: 80px 20px;
	width: 1000px;
}

.containerHeading {
	padding: 40px 0px;
}

.containerHeading .titStyle1 {
	margin-bottom: 0;
}

.customSelect {
	font-size: 12px;
	padding: 10px 30px 10px 10px;
	background: #ffffff url("../images/select_bg.png") right center no-repeat;
	border-radius: 3px;
	color: #000000;
	width: 100%;
	text-align: left;
	margin-bottom: 20px;
	display: block;
}

.customSelectInner {
	width: 100%!important;
}

.select-language .block{
	margin-right: 8px;
	font-size: 15px;
}

.titStyle1 {
	font-size: 36px;
	font-weight: bold;
	margin-bottom: 50px;
}

.titStyle2 {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 20px;
}

.titStyle3 {
	font-size: 22px;
	font-weight: bold;
	margin: 10px 0;
}

.titStyle4 {
	font-size: 18px;
	margin-bottom: 10px;
}

.titStyle4 span {
	font-size: 24px;
	font-weight: bold;
	color: #cc0000;
}

.titStyle5 {
	color: #ffffff;
	background: #aaaaaa;
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	padding: 10px;
}

.titStyle5 span {
	font-size: 36px;
}

.titStyle6 {
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 30px;
}

.titStyle7 {
	font-size: 20px;
}

.titStyle8 {
	color: #ce0404;
	font-size: 30px;
	font-weight: bold;
	margin-bottom: 50px;
}

span.icon-sim {
	background: url("../images/icon_sim.png") left center no-repeat;
	padding: 10px 0 10px 50px;
}

span.icon-shuriken {
	background: url("../images/icon_shuriken.png") left 4px no-repeat;
	padding-left: 40px;
}

.paddingTop0 {
	padding-top: 0!important;
}

.paddingTop5 {
	padding-top: 5px!important;
}

.marginTop20 {
	margin-top: 20px!important;
}

.marginBottom0 {
	margin-bottom: 0!important;
}

.marginBottom40 {
	margin-bottom: 40px!important;
}

.marginBottom50 {
	margin-bottom: 50px!important;
}

.marginBottom60 {
	margin-bottom: 60px!important;
}

.margin0 {
	margin: 0!important;
}

small {
	font-size: 12px;
}

.small {
	font-size: 14px;
}

.sectionType1 {
	background: #f3e6cb;
}

.sectionType2 {
	background: #eeeeee;
}

.sectionType3 {
	border-top: 2px solid #eeeeee;
}

.displayTable {
	width: 100%;
	display: table;
	border-collapse: collapse;
}

.displayTable .tableCell {
	display: table-cell;
	vertical-align: middle;
}
.d-flex{
    display: flex;
}
.flex-wrap{
    flex-wrap: wrap;
}
.j-content-center{
    justify-content: center;
}
.j-content-between{
    justify-content: space-between;
}
.a-items-start{
    align-items: flex-start;
}
.a-items-center{
    align-items: center;
}
.text-white{
    color: #ffffff;
}



/* btn
-------------------------------------------------- */
.btn a {
	display: inline-block;
}

.btn a:hover {
	text-decoration: underline;
}

.btn {
	text-align: center;
}

.btn-block a {
	width: 100%;
}

.btnType1 a, .btnType3 a, .btnType4 a{
	background-color: #ffffff;
	padding: 10px 20px;
	color: #000000;
}

.btnType1 a span, .btnType3 a span,.btnType4 a span {
	padding-right: 20px;
	background: url("../images/icon_right2.png") right no-repeat;
	display: block;
}

.btnType2 a {
	background: #00b5aa;
	font-size: 16px;
	color: #ffffff;
	padding: 10px;
}

.btnType2 a:hover {
	background: #09d3c7;
}

.btnType2-alt a {
	font-size: 24px;
	font-weight: bold;
	min-width: 600px;
}

.btnType3 a {
	border: 2px solid #eee0c3;
	font-size: 18px;
	color: #333333;
	min-width: 495px;
}

.btnType3-alt a {
	border-color: #dddddd;
}

.btnType4 a {
	border: 2px solid #dddddd;
	font-size: 14px;
	color: #333333;
}

.btn-calendar {
	margin-bottom: 10px;
}

.btn-calendar a {
	width: 100%;
	text-align: left;
	font-size: 14px;
	color: #ffffff;
	padding: 10px;
	border-radius: 3px;
	display: block;
	background: #666666 url("../images/calendar_btn_bg.png") right center no-repeat;
	cursor: pointer;
}

.calendar {
	display: none;
	position: absolute;
	width: 276px;
	margin-left: -28px;
	padding-top: 10px;
	background: url("../images/calendar_bg.png") top center no-repeat;
	z-index: 9;
}

.calendarBody {
	width: 100%;
	border: 2px solid #666666;
	background: #ffffff;
	color: #000000;
}

.calendar .ui-datepicker .ui-datepicker-header {
	padding: 0;
}

.calendar .ui-widget-header {
	border-color: #666666;
	background: #666666;
}

.calendar #datepicker1, .calendar #datepicker2 {
	border: 0;
}

.calendar .ui-datepicker-title {
	padding: 0 31px;
	background: #666666;
	color: #fff;
	position: relative;
	font-weight: bold;
	line-height: 31px;
	text-align: center;
	font-family: "Arial";
	font-size: 16px;
}

.calendar .ui-datepicker-prev {
	left: 3px;
	background: #666666 url("../images/ico_arrow_3.png") center center no-repeat;
	background-size: 6px 9px;
}

.calendar .ui-datepicker-next, .calendar .ui-datepicker-prev {
	width: 25px;
	height: 25px;
	text-indent: -9999px;
	overflow: hidden;
	box-shadow: 0;
	position: absolute;
	top: 3px;
}

.calendar .ui-datepicker-next {
	right: 3px;
	background: #666666 url("../images/ico_arrow_4.png") center center no-repeat;
	background-size: 6px 9px;
}

.calendar .ui-datepicker-next span, .calendar .ui-datepicker-prev span {
	background: 0;
}

.calendar .ui-datepicker-next a {
	display: block;
	width: 25px;
	height: 25px;
}

.calendar .ui-datepicker {
	padding: 0;
	width: 100%;
	border: 0;
	background: 0;
}

.calendar .ui-datepicker-calendar {
	table-layout: fixed;
	font-family: "Arial";
	font-size: 12px;
}

.calendar .ui-datepicker-calendar thead th {
	padding: 7px 5px;
	text-align: center;
	font-weight: 700;
	color: #999;
	background: #d3d3d3;
	font-size: 12px;
	text-transform: uppercase;
}

.calendar .ui-datepicker-calendar thead th:first-child {
	color: #ce0404;
}

.calendar .ui-datepicker-calendar thead th:last-child {
	color: #3490bb;
}

.calendar .ui-datepicker-calendar td {
	padding: 0;
	border: 1px solid #d3d3d3;
	background: #fff;
	text-align: center;
	height: 40px;
}

.calendar .ui-datepicker-calendar td:last-child {
	border-right: 0;
}

.calendar .ui-datepicker-calendar td:first-child {
	border-left: 0;
}

.calendar .ui-datepicker-calendar .ui-datepicker-other-month {
	background: #eee;
	opacity: 1;
}

.calendar .ui-datepicker-calendar td a {
	display: table;
	width: 100%;
	text-align: center;
}

.calendar .ui-state-hover {
	border: 0 !important;
}

.calendar .ui-datepicker-calendar td a, .calendar .ui-datepicker-calendar td span {
	text-align: center;
	font-weight: 400;
}

.calendar .ui-state-default, .calendar .ui-widget-content .ui-state-default, .calendar .ui-widget-header .ui-state-default {
	border: 0;
	background: none;
	font-size: 12px;
}

.calendar .ui-datepicker table {
	margin: 0;
}

.calendar .ui-datepicker-calendar .ui-state-active {
	background: #ce0404;
	color: #fff;
	height: 39px;
	border-radius: 0;
	line-height: 3.2;
}

.btn_order {
	display: block;
	margin-top: 20px;
	padding: 10px 0;
	background: #00b5aa;
	color: #fff;
	font-size: 14px;
	position: relative;
	padding-right: 5px;
}
.btn_order:hover{
	text-decoration: underline;
}
.btn_order::after{
    content: "";
    display: inline-block;
    width: 5px;
    height: 5px;
    border: 2px solid;
    border-color: #fff #fff transparent transparent;
    transform: translateY(-50%) rotate(45deg);
    position: absolute;
    right: 15px;
    top: 50%;
}
.btnType2 .btn_order::after{
	width: 8px;
    height: 8px;
    border: 3px solid;
	border-color: #fff #fff transparent transparent;
	right: 25px;
}

/* twocolumns
-------------------------------------------------- */
.twoColumns {
	width: 100%;
	display: table;
	table-layout: fixed;
}

.twoColumns .column {
	width: 50%;
	display: table-cell;
	vertical-align: top;
}

.twoColumns .columnAlt {
	background: #fff;
	padding: 30px;
}

.twoColumns .columnAlt .twoColumns {
	border-spacing: 0;
	margin-top: 20px;
}

.twoColumns .columnAlt .twoColumns .column:first-child {
	width: 124px;
	padding-right: 15px;
}

.twoColumnsType1 .column:first-child {
	width: 328px;
	padding: 0 30px;
}

.twoColumnsWrapper {
	margin: 0 -30px;
}

.twoColumnsType2 {
	border-spacing: 30px 0;
}

.twoColumnsType3 {
	border-spacing: 30px;
	background: #eeeeee;
}

/* threecolumns
-------------------------------------------------- */
.container .threeColumns {
	width: 100%;
	display: table;
	margin-bottom: 40px;
}

.container .threeColumns .column {
	width: 33.33%;
	display: table-cell;
	vertical-align: top;
}

.container .threeColumnsType1 {
	background: #f1f1f1;
	border-spacing: 10px;
	padding: 10px;
	margin-top: 60px;
}

.container .threeColumnsType1 .column {
	background: #ffffff;
	vertical-align: middle;
	padding: 20px;
}

.container .threeColumnsWrapper {
	margin: 0px -30px;
}

.container .threeColumnsType2 {
	border-spacing: 30px 0;
	margin-bottom: 0;
}

.container .threeColumnsType3 {
	margin-bottom: 60px;
}

.container .threeColumnsType3 .column {
	background: #ffffff;
	border: 4px solid #dddddd;
	padding: 20px;
	position: relative;
}

.container .threeColumnsType3 .column .image {
	margin-bottom: 30px;
}

.container .threeColumnsType3 .column:before {
	position: absolute;
	content: ' ';
	background: url("../images/img_step_top.png") center no-repeat;
	width: 41px;
	height: 21px;
	top: -25px;
	left: 50%;
	margin-left: -20px;
}


/* fourcolumns
-------------------------------------------------- */
.fourColumns {
	width: 100%;
	display: table;
}

.fourColumns .column {
	width: 20%;
	display: table-cell;
	vertical-align: top;
}

.fourColumnsWrapper {
	margin: 8px -12px 30px;
}

.fourColumnsType1 {
	background: #eeeeee;
	border-spacing: 12px;
}

.fourColumnsType1 .column {
	background: #ffffff;
	padding: 25px;
}

.fourColumnsType1 .column .image {
	margin-bottom: 10px;
}

/* fiveColumns
-------------------------------------------------- */
.fiveColumns {
	width: 100%;
	display: table;
	table-layout: fixed;
}

.fiveColumns .column {
	width: 25%;
	display: table-cell;
	vertical-align: top;
	padding: 0px 20px;
}


/* generalTable
-------------------------------------------------- */
.generalTable table {
	width: 100%;
	border-collapse: collapse;
	background: #ffffff;
}

.generalTable th, .generalTable td {
	border: 1px solid #cccccc;
	padding: 12px;
	vertical-align: top;
	text-align: center;
}

.generalTable th {
	background: #fff3da;
	font-weight: bold;
}

.generalTable td.tdStyle1 {
	background: #eeeeee;
	font-weight: bold;
}

.generalTable td.tdStyle2 {
	background: #949494;
	color: #ffffff;
}

/* coupon top
-------------------------------------------------- */
.couponTop a {
	background: #e89e00 url("../images/coupon_bg.png") 4px center no-repeat;
	color: #ffffff;
	float: right;
	margin-right: 30px;
	display: table;
	min-width: 370px;
	padding: 6px;
}

.couponTop a:hover {
	text-decoration: none;
}

.couponTop .btn {
	float: right;
	font-size: 12px;
	background-color: #fff3da;
	color: #df7d00;
	padding: 10px;
	line-height: 1;
	padding: 9px 10px;
	margin-left: 10px;
}

.couponTop .btn span {
	padding-right: 10px;
	background: url("../images/icon_right1.png") right no-repeat;
}

.couponTop .columnLeft, .couponTop .columnRight {
	display: table-cell;
	vertical-align: middle;
}

.couponTop .columnLeft {
	width: 60px;
	color: #df7d00;
	font-size: 13px;
	text-align: center;
	line-height: 15px;
}

.couponTop .columnRight {
	font-size: 18px;
	font-weight: bold;
	padding-left: 10px;
	font-family: "Arial";
}

/* popup */
#popup-mask {
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: .7;
	display: none;
	z-index: 9000;
	top: 0;
	left: 0;
	right: 0;
}

#top-popup {
	display: none;
	z-index: 10000;
	width: 800px;
	background: #fff;
	padding: 40px;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	max-height: 90%;
	overflow: scroll;
}

#top-popup img {
	width: 100%;
}

.popup-txt {
    margin: 10px 0 30px;
    font-size: 14px;
}

.popup-close-btn {
	background-color: #000;
	color: #fff;
	text-align: center;
	margin: 10px auto 0;
	width: 120px;
	border-radius: 5px;
	box-shadow: 3px 3px 3px rgb(0 0 0 / 30%);
	cursor: pointer;
    padding: 5px 0;
    font-size: 13px;
}

.popup-block {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px calc((100% - 960px) / 2);
}
.popup-title {
	cursor: pointer;
	text-decoration: underline;
    font-weight: bold;
	color: #cc0000;
}

/* keyvisual
-------------------------------------------------- */
.keyvisual {
	background: #ced5ee url('../images/keyvisual_bg.jpg') no-repeat center;
	background-size: cover;
}

.keyvisual .container {
	padding: 20px 20px 30px;
	width: 1000px;
}

.keyvisual .twoCol .columnLeft {
	float: left;
	width: 280px;
	background: rgba(0,0,0,0.5);
	color: #ffffff;
}

.keyvisual .twoCol .columnLeft .heading {
	background: #000000;
	text-align: center;
	display: block;
	font-size: 16px;
	padding: 15px;
	line-height: 1;
	font-weight: bold;
}

.keyvisual .twoCol .columnLeft .body {
	padding: 20px 30px 30px;
	font-size: 14px;
	text-align: center;
}

.keyvisual .twoCol .columnLeft .body p{
	margin-bottom: 20px;
}

.keyvisual .twoCol .columnRight {
	/* float: right; */
	width: 660px;
	color: #ffffff;
	font-size: 16px;
	margin: 0 auto;
	text-align: center;
}

.keyvisual .twoCol .columnRight .highlight {
	background: rgba(255,255,255,0.8);
	color: #000000;
	margin-top: 20px;
}

.keyvisual .twoCol .columnRight .highlight.affiliate_banner{
	width: 100%;
}

.keyvisual .twoCol .columnRight a:hover .highlight.affiliate_banner{
	opacity: .95;
}

.keyvisual .twoCol .columnRight .highlight .heading {
	background: #ffffff;
	text-align: center;
	display: block;
	font-size: 24px;
	padding: 10px;
	font-weight: bold;
}

.keyvisual .twoCol .columnRight .highlight .body {
	padding: 30px;
}

.keyvisual .twoCol .columnRight .highlight .body .twoCol {
	padding: 30px;
}

.highlight .body .featured {
	display: table;
	width: 100%;
	margin-bottom: 20px;
}

.highlight .body .featured .featuredTxt, .highlight .body .featured .featuredImg {
	display: table-cell;
	vertical-align: top;
}

.highlight .body .featured .featuredTxt {
	text-align: center;
	font-size: 18px;
}

.highlight .body .featured .featuredTxt span {
	font-size: 24px;
	font-weight: bold;
}

.highlight .body .featured .featuredImg {
	text-align: center;
	width: 206px;
	vertical-align: middle;
}

.highlight .btn {
	margin-left: 100px;
	margin-right: 100px;
}

.keyvisual .kvCoupon {
	display: table;
	width: 100%;
	background: #ffffff;
}

.keyvisual .kvCLeft, .keyvisual .kvCCenter, .keyvisual .kvCRight {
	display: table-cell;
	vertical-align: middle;
}

.keyvisual .kvCLeft {
	background: #efa200 url("../images/coupon_bg.png") 10px center no-repeat;
	color: #ffffff;
	width: 258px;
	padding: 15px 0;
}

.keyvisual .kvCLeft .couponDiv {
	display: table;
}


.keyvisual .kvCLeft .couponDiv .couponText1, .couponDiv .kvCLeft .couponText2 {
	display: table-cell;
	vertical-align: middle;
}

.keyvisual .kvCLeft .couponText1 {
	width: 84px;
	text-align: center;
	color: #df7d00;
	font-size: 14px;
	line-height: 1.4;
}

.keyvisual .kvCLeft .couponText2 {
	font-size: 28px;
	font-weight: bold;
	font-family: "Arial";
	line-height: 1;
	padding-left: 10px;
}

.keyvisual .kvCCenter {
	font-size: 16px;
	padding: 15px 30px;
	line-height: 1.5;
	width: 520px;
}

.keyvisual .kvCRight .btn {
	float: right;
	margin-right: 32px;
}

.keyvisual .kvCRight .btn a {
	font-size: 14px;
	background-color: #efa200;
	color: #ffffff;
	padding: 10px;
	line-height: 1;
	padding: 10px 12px;
}

.keyvisual .kvCRight {
	width: 182px;
}

.keyvisual .kvCRight .btn a span {
	padding-right: 15px;
	background: url("../images/icon_right3.png") right no-repeat;
}


.keyvisualPage {
	color: #ffffff;
	overflow: hidden;
	padding-bottom: 80px;
}

.keyvisualPage .kvContainer {
	background: #ced5ee url('../images/keyvisual_bg.jpg') no-repeat center;
	background-size: cover;
	height: 276px;
}

.kvAbout .kvContainer {
	background-image: url('../images/about/keyvisual_bg.jpg');
}

.keyvisualPage .kvContainer .container {
	display: table;
	padding: 50px 20px;
}

.keyvisualPage .kvPageText {
	width: 495px;
	display: table-cell;
	vertical-align: middle;
}

.keyvisualPage .kvPageText .heading {
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 15px;
}

.keyvisualPage .kvPageImg {
	text-align: center;
	width: 465px;
	float: right;
	padding-top: 20px;
}

.keyvisualPage .kvPageImg img{
	filter: drop-shadow(0 2px 10px rgba(255,255,255, 0.5));
}

.keyvisual .twoCol .columnRight .mv_note{
	font-size: 14px;
    /* text-align: right; */
	font-weight: bold;
	filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.5));
}

.esim_banner{
	margin-top: 50px;
	display: block;
	font-size: 0;
}

.esim_banner img{
	width: 100%;
}

.esim_banner:hover img{
	opacity: .8;
}

/* graySection
-------------------------------------------------- */
.graySection {
	background: #eeeeee;
	padding: 30px;
	margin: 40px auto 60px;
}

.graySection .twoColumns{
	table-layout: auto;
	width: 100%;
}

.graySection .twoColumns .column {
	vertical-align: middle;
	width: auto;
}

.graySection .twoColumns .column:first-child {
	padding-right: 30px;
    width: 200px;
}

/* stepsHeader
-------------------------------------------------- */
.container .step, .stepsHeader {
	text-align: center;
	margin-bottom: 30px;
}

/* faqArea
-------------------------------------------------- */
.faqArea {
	padding: 30px;
	background: #eeeeee;
}

.faqArea ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.faqArea ul li {
	margin-bottom: 2px;
}

.faqArea li a {
	background: #ffffff;
	font-size: 18px;
	color: #000000;
	display: block;
	padding: 20px;
}

.faqArea li a span {
	display: block;
	background: url("../images/icon_right2.png") right no-repeat;
}

/* .footer
-------------------------------------------------- */
.footer {
	color: #ffffff;
}

.copyright .container {
	padding: 16px 0px;
}

.copyright .block {
	float: left;
	margin-right: 15px;
	font-size: 18px;
	line-height: 37px;
}

.copyright .select-block {
	float: left;
	width: 180px;
	margin-right: 60px;
}

ul.footerList {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: 24px;
}

ul.footerList li {
	margin-bottom: 30px;
}

ul.footerList li a {
	color: #ffffff;
	font-size: 14px;
	background: url("../images/icon_footerlink_1.png") left center no-repeat;
	padding-left: 25px;
}

ul.footerList li.pdfLink a {
	background-image: url("../images/icon_pdf.png");
}

ul.footerList li ul {
	margin-left: 25px;
	margin-top: 8px;
}

ul.footerList li ul li {
	margin-bottom: 8px;
}

ul.footerList li ul li a {
	background: url("../images/icon_footerlink_2.png") left center no-repeat;
	padding-left: 15px;
}

.footerLALinks p a{
    background: url("../images/laLinks.jpg") no-repeat 0 0;
    border: 1px solid #999;
    display: block;
    width: 304px;
    height: 80px;
	overflow: hidden;
    font-size: 14px;
    line-height: 21px;
    padding: 5px;
    font-weight: bold;
    text-decoration: none !important;
	text-shadow: 1px 1px 1px #000;
	display: none;
}

.footer div.vision_banner p{
	font-size: 12px;
}

/* callcenter
-------------------------------------------------- */
.callCenter {
	margin-top: 60px;
	background: #ffffff;
	padding: 20px;
	color: #000000;
}

.ccTop {
	font-size: 20px;
	text-align: center;
	font-family: "Arial";
	font-weight: bold;
	display: table;
	width: 300px;
	margin: 0 auto;
	padding-bottom: 20px;
}

.ccTop div {
	display: table-cell;
	vertical-align: middle;
}

.ccTop div:last-child {
	width: 140px;
}

.ccBottom {
	text-align: center;
	border-top: 1px solid #cccccc;
	margin: 0 30px;
	padding-top: 20px;
	font-size: 16px;
}

.ccBottom.nwi-757.tw{
	text-align: left;
}

.ccBottom span {
    font-size: 18px;
    font-weight: bold;
    display: inline-block;
    margin-right: 20px;
}

.ccBottom.nwi-757>div{
	padding: 0 200px;
}

.ccBottom.nwi-757 .contact_box{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.ccBottom.nwi-757 .contact_box p {
	display: inline-flex;
	align-items: center;
	font-weight: normal;
	margin: 5px 0;
}

.ccBottom.nwi-757 .contact_box p:nth-child(odd){
	width: 55%;
}

.ccBottom.nwi-757 .contact_box p::before {
    content: "";
    width: 30px;
    height: 30px;
    display: inline-block;
    margin-right: 8px;
}

.ccBottom.nwi-757 .contact_box p.mail::before {
	background: url(../images/icon_mail.png) no-repeat;
	background-position: center;
    background-size: contain;
}

.ccBottom.nwi-757 .contact_box p.tel::before {
	background: url(../images/icon_phone.png?date=20230831) no-repeat;
	background-position: center;
    background-size: contain;
}

.ccBottom.nwi-757 .contact_box p.facebook::before {
	background: url(../images/icon_facebook.png) no-repeat;
	background-position: center;
    background-size: contain;
}

.ccBottom.nwi-757 .contact_box p.whatsapp::before {
	background: url(../images/icon_whatsapp.png) no-repeat;
	background-position: center;
    background-size: contain;
}

.ccBottom.nwi-757 .contact_box p.facebook a{
	text-decoration: underline;
	cursor: pointer;
}

.ccBottom.nwi-757 p.time{
	margin-top: 10px;
}

/* NWI-757 コールセンターの営業時間変更 */
.ccBottom.nwi-757 p {
	font-weight: normal;
}

/* percentTable
-------------------------------------------------- */
.percentTable {
	overflow: hidden;
	margin-bottom: 5px;
}

.p10 {
	background: url("../images/about/img_chart_1.png") left bottom no-repeat;
}

.p50 {
	background: url("../images/about/img_chart_2.png") left bottom no-repeat;
}

.percentTable .column {
	float: right;
	width: 682px;
}

.borderedBox {
	border: 10px solid #eeeeee;
	padding: 30px;
	margin-top: 30px;
}

.graph {
	position: relative;
	padding-top: 10px;
}

.graphText1 {
	color: #676767;
	font-weight: bold;
	font-size: 14px;
	position: absolute;
	top: 2px;
	left: 30px;
}

.graphText2 {
	color: #cc0000;
	font-weight: bold;
	font-size: 18px;
	position: absolute;
	bottom: 11px;
	left: 80px;
}

.graphText3 {
	color: #cc0000;
	font-weight: bold;
	font-size: 18px;
	position: absolute;
	bottom: -5px;
	left: 30px;
}


/* comparisonTable
-------------------------------------------------- */
.comparison {
	background: #eeeeee;
	padding: 30px 0;
}

.comparisonTable {
	display: table;
	width: 100%;
	border-spacing: 30px 0;
	background: #eeeeee;
	table-layout: fixed;
}

.comparisonTable2 {
	padding-top: 30px;
}

.comparisonTable .column {
	width: 50%;
	display: table-cell;
	background: #ffffff;
}

.comparisonTable .heading {
	background: #6b6b6b;
	color: #ffffff;
	font-size: 18px;
	padding: 5px;
	font-weight: bold;
}

.comparisonTable .heading span {
	display: inline-block;
	background: #ffffff;
	font-size: 14px;
	color: #cc0000;
	padding: 10px;
	margin-right: 15px;
}

.comparisonTable .body {
	padding: 30px;
}

.comparisonTable .body .btn {
	margin-top: 20px;
	font-size: 16px;
	font-weight: bold;
}

.comparisonTable .body .btn a {
	padding: 15px 20px;
}

.comparisonTable .body .image {
	text-align: center;
	margin-bottom: 10px;
	position: relative;
	font-size: 12px;
}

.comparisonTable .body .btnImg a {
	display: table;
	width: 100%;
	border-spacing: 10px;
	table-layout: fixed;
	padding: 0;
	line-height: 1;
}

.comparisonTable .body .btnImg .img {
	display: table-cell;
	vertical-align: middle;
	width: 80px;
}

.comparisonTable .body .btnImg span {
	display: table-cell!important;
	vertical-align: middle;
	text-align: left;
	padding-left: 10px;
}

.imageText {
	color: #cc0000;
}

.imageText1, .imageText2, .imageText3 {
	position: absolute;
}

.imageText1 {
	top: 7px;
	left: 55px;
}

.imageText2 {
	bottom: 11px;
	left: 59px;
}

.imageText3 {
	font-size: 16px;
	width: 164px;
	bottom: 42px;
}

.txtRedBold {
	color: #cc0000;
	font-weight: bold;
}

.fixedHeader {
	position: fixed;
	width: 100%;
	top: 0;
	z-index: 9;
}

/* old style fixes
-------------------------------------------------- */
#static_contents {
	margin-bottom: 40px;
}

.plan article#plan_03 .w960 {
	width: 960px;
}

.plan article#plan_03 .w470 {
	width: 470px;
}

.callCenterInfo {
	padding: 30px 50px;
}

.w300 {
	width: 300px;
}

.faq .icon_a {
	min-height: 80px;
}

#narita1_pickup, #narita1_return, #narita2_pickup, #narita2_return,#narita3,#narita3_pickup, #narita3_return, #narita2_sim, #haneda2, #haneda3, #haneda, #haneda_returnbox, #haneda_afterhour, #haneda_jal_return, #kansai,#kansai2, #kansai_sim,#chubu,#chubu2, #fukuoka, #newchitose,#newchitose2, #naha, #niigata, #komatsu, #kagoshima, #kagoshima2, #shizuoka, #asahikawa, #sendai {
	width: 820px;
}

.apBlock {
	overflow: hidden;
	position: relative;
	width: 1000px;
	height: 490px;
	background-image:url(/img/new/receive/img_airport.png);
	background-repeat:no-repeat;
	background-position: 360px 0px;
	background-size: 510px 454px;
}
.apBlock .apText {
	width:375px;
	padding-left:20px;
}
.apBlock .apImg {
	float: right;
	width: 571px;
	margin-right: 20px;
}

.apBlock .image {
	margin-bottom: 20px;
}

.apBlock .apText p.apTextHead {
	color:#ce0000;
	font-size:36pt;
	font-weight:bold;
	font-family:Arial;
}

.apNote {
	position: absolute;
	background: url("/img/receive/icon_circle.png") center no-repeat;
	width: 72px;
	height: 72px;
	right: 10px;
	top: 10px;
	text-align: center;
	font-weight: bold;
	line-height: 1!important;
}

.apNote .note1 {
	color: #ffffff;
	font-size: 12px;
	display: block;
	margin-top: 16px;
}

.apNote .note2 {
	color: #cc0000;
	font-size: 20px;
	display: block;
	margin-top: 12px;
}

.btn_airport_map {
	position: absolute;
	width: 163px;
	height:40px;
	padding: 7px;
	padding-right: 26px;
	border: solid #000000 1px;
	border-radius: 0.2em;
	background-color: #ffffff;
	text-align: center;
	color: #000000 !important;
	font-size: 12pt;
	font-weight: bold;
}

.btn_airport_map:after {
	content: "\025bc";
	font-size: 12pt;
	color: #cc0000;
	position: absolute;
	top: 20px;
	right: 10px;
	margin-top: -12px;
}

a.btn_style_00 {
	display:block;
	height: 40px;
	border: 0px;
	color: #ffffff;
	font-size: 1.2em;
	line-height: 40px;
	text-align:center;
	background: #000000 url('../img/btn_common_000.gif') right top no-repeat;
}
a.btn_style_00:hover {
	opacity: 0.8;
	text-decoration:none;
}
.btn_unlimited{
	background: #fff;
	display: inline-block;
	font-size: .8em;
	padding: 5px 20px;
}
ol.parentheses > li {
    list-style-type:none;
    list-style-position:outside;
    counter-increment: number;
    margin-bottom: 5px;
}
ol.parentheses > li:before {
    display: marker;
    margin-left:-3em;
    content: "(" counter(number) ") ";
}
ol.parentheses_r > li {
    list-style-type:none;
    list-style-position:outside;
    counter-increment: i;
    margin-bottom: 5px;
}
ol.parentheses_r > li:before {
    display: marker;
    margin-left:-4em;
    content: counter(i, lower-roman) ") ";
}

.float_r {
	float: right;
}

/* 新規デザイン（esim/sim） 共通CSS */
.layoutArea h2{
    font-size: 2rem;
    margin-bottom: 20px;
    line-height: 1.2;
}
.layoutArea p{
    line-height: 1.5;
    text-align: left;
}
.layoutArea .wrapper{
    padding: 50px 20px;
    width: 1000px;
    margin: 0 auto;
}
.font-montserrat{
    font-family: "Montserrat";
}
/* その他のサービス */
.otherDiv h2.arrow{
    padding-left: 40px;
    background: url(/img/plan/esim/icon_arrow.png) left center / 30px no-repeat;
}
.otherContents{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 70px 0 20px;
}
.otherBtn{
    width: 48%;
    cursor: pointer;
    position: relative;
}
.otherBtn:hover{
    opacity: .9;
}
.otherBtn:hover .otherBg img{
    transform: scale(1.1);
}
.otherBox{
    text-align: center;
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    z-index: 2;
}
.otherBox::before{
    content: '';
    width: 70px;
    height: 70px;
    background-color: #000000;
    background:linear-gradient(+135deg, transparent 50%, #b92429 0);
    position: absolute;
    right: 0px;
    bottom: 0px;
}
.otherBox::after{
    content: '';
    position: absolute;
    width: 13px;
    height: 13px; 
    right: 15px;
    bottom: 15px;
    border-top: 2px solid #ffffff; 
    border-right: 2px solid #ffffff; 
    transform: rotate(45deg); /* 45:> , 225:< , 135:∨ , 315:∧ */
}
.otherBox img{
    width: 70%;
}
.otherBox p.otherBtnText{
    text-align: center;
    padding: 10px 0;
    font-weight: bold;
    font-size: 2.3rem;
    color: white;
}
.otherBg {
    position: relative;
    text-align: center;
    overflow: hidden;
    height: 220px;
}
.otherBg::before{
    content: '';
    background: rgba(0, 0, 0, .5);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}
.otherBg img {
    width: 100%;
    transition: transform .6s ease; /* ゆっくり変化させる */
}

/* PAGE TOP AREA */
.layoutArea .topWrapper{
	display: flex;
	align-items: center;
	justify-content: center;
    background: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)),
    url('../img/receive/top_bg_receive.png') center top / cover no-repeat;
    min-height: 260px;
}
.layoutArea .contents{
    width: 981px;
}
.topTitle{
	font-size: 4rem;
	line-height: 1.2;
	text-shadow: 0px 0px 20px #ffffff;
}
.topSubTitle{
    font-size: 1.6rem;
	display: block;
	margin-top: 10px;
	text-shadow: 0px 0px 20px #ffffff;
}

/* ナビゲーションバー（受取・返却方法） */
nav.submenu_base{
	width: 100%;
    background: #cc0000;
}
nav.submenu_base ul.submenu_pc{
	width: 1000px;
    margin: 0 auto;
	display: flex;
}
nav.submenu_base ul.submenu_pc li a{
	display: block;
    height: 40px;
    line-height: 40px;
    padding: 0px 45px 0 25px;
    font-size: 1em;
    color: #ffffff;
	position: relative;
}
nav.submenu_base ul.submenu_pc li a::before{
	position: absolute;
	right: 25px;
	top: 50%;
	content: '';
	width: 8px;
	height: 8px;
	border-top: 1px solid #ffffff;
	border-right: 1px solid #ffffff;
	transform: translateY(-50%) rotate(45deg);
}
nav.submenu_base ul.submenu_pc li a:hover,nav.submenu_base ul.submenu_pc li a.on{
	color: #cc0000;
	background: #ffffff;
	text-decoration:none;
}
nav.submenu_base ul.submenu_pc li a:hover:before,nav.submenu_base ul.submenu_pc li a.on::before{
	border-top: 1px solid #cc0000;
	border-right: 1px solid #cc0000;
}

/* ORDER BTN */
.btnOrder{
	display: flex;
	align-items: center;
	justify-content: center;
    background-color: #009EA8;
    font-weight: 500;
	text-align: center;
    font-size: 1.3rem;
    padding: 15px 0;
    width: 350px;
    border-radius: 5px;
	color: #ffffff!important;
}
.btnOrder:hover{
    background-color: #1ab4bf;
	text-decoration-line: none;
}
.arrowSmallWhite {
    position: relative;
	margin-left: 15px;
}
.arrowSmallWhite::after {
    position: absolute;
    right: 0; 
    top: 50%; 
    content: '';
    width: 8px;
    height: 8px; 
    border-top: 1px solid #ffffff; 
    border-right: 1px solid #ffffff; 
    transform: translateY(-50%) rotate(45deg); /* 45:> , 225:< , 135:∨ , 315:∧ */
}

a.banner_esim_korea{
	display: block;
	margin-top: 50px;
	transition: .3s;
}
a.banner_esim_korea:hover{
	opacity: .9;
}
a.banner_esim_korea img{
	width: 100%;
	vertical-align: middle;
}

@media screen and (max-width:799px) {
	.pc {
        display: none;
    }
    .sp {
        display: block;
    }

    .layoutArea .wrapper{
        width: 100%;
        padding: 50px 20px;
    }
    .layoutArea h2{
        font-weight: bold;
        font-size: 1.5rem;
        margin-bottom: 20px;
    }
    .layoutArea p{
        font-size: 14px;
        margin-bottom: 0;
    }
	.topTitle{
		font-size: 3rem;
	}

    .font-montserrat{
        font-family: "Montserrat";
    }

    main.page{
        padding-top: 51px;
    }

    /* その他のサービス */
    .otherContents{
        margin: 80px 0 0;
    }
    .otherBtn{
        width: 100%;
    }
    .otherBtn + .otherBtn{
        margin-top: 80px;
    }
    .otherBox p.otherBtnText{
        font-size: 1.6rem;
    }
    .otherBg{
        height: 40vw;
    }
	/* PAGE TOP AREA */
	.layoutArea .topWrapper{
        min-height: auto;
        width: 100%;
        text-align: center;
    }
	.topWrapper .contents{
		padding: 40px 20px;
	}

	.btnOrder{
		width: 90%;
	}

	nav.submenu_base{
		display: none;
	}
}