@font-face {
	font-family: "SourceSansPro-Regular";
	src: url(../fonts/SourceSansPro-Regular.otf);
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: "Roboto-Regular";
	src: url(../fonts/Roboto-Regular.ttf);
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: "Courier-New";
	src: url(../fonts/Courier-New.ttf);
	font-weight: 400;
	font-display: swap;
}

.page-h1 {
	font-weight: 400;
	color: #333333;
	font-size: 20px;
}

.page-h2{
	font-weight: 300;
	color: #333333;
	font-size: 20px;
}

.large-body{
	font-weight: 400;
	color: #333333;
	font-size: 18px;
}

.large-body-light{
	font-weight: 300;
	color: #333333;
	font-size: 18px;
}

.body{
	font-weight: 400;
	color: #333333;
	font-size: 14px;
}

.body-light{
	font-weight: 300;
	color: #333333;
	font-size: 14px;
}

.text-btn{
	font-weight: 400;
	color: #666666;
	font-size: 14px;
	cursor: pointer;
}

.text-btn:hover{
	color: #FF0000;
}

.text-btn:active{
	color: #FF0000;
}

.text-link-red{
	font-weight: 400;
	color: #FF0000;
	font-size: 14px;
	text-decoration:none;
	cursor: pointer;
}

.text-link-blue{
	color: #33488f;
	cursor: pointer;
}

.text-link-red:hover{
	text-decoration:underline;
}

.text-link-red:active{
	text-decoration:underline;
}

.underlineText{
	text-decoration:underline;
}

.underlineBold{
	text-decoration: underline;
	font-weight: 700;
}

.plan-title-huge {
	font-weight: 600;
	font-size: 18px;
	color: #333333;
}

.plan-total-price {
	font-weight: 400;
	font-size: 18px;
	color: #333333;
}

.plan-item-price{
	font-weight: 400;
	font-size: 14px;
	color: #333333;
}

.per-month{
	font-weight: 300;
	font-size: 14px;
	color: #333333;
}

.contract-period{
	font-weight: 300;
	font-size: 14px;
	color: #333333;
}

.customer-name{
	font-weight: 300;
	font-size: 24px;
	color: #333333;
}

.review-item-header{
    font-weight: 400;
    font-style: normal;
    font-size: 12px;
    color: #868686;
}

.review-item{
	font-weight: 300;
	font-size: 18px;
	color: #333333;
}

.nowrapText{
	white-space: nowrap;
}


.f1-font, .f1-font *{
	font-size: 5.6vw;		/* 21px in 375 */ 
}

.f2-font, 
.title-bar .title, 
.f2-font *, 
.title-bar .title *{
	font-size: 4.8vw;		/* 18px in 375 */
}

.f2_1-font, .f2_1-font *{
	font-size: 4.533vw;		/* 17px in 375 */ 
}

.f2_2-font, .f2_2-font *{
	font-size: 4.267vw;		/* 16px in 375 */ 
}

.f3-font, .f3-font *{
	font-size: 4vw;			/* 15px in 375 */
}

.f3_5-font, .f3_5-font *{	
	font-size: 3.7333vw;	/* 14px in 375 */
}

.f4-font, .f4-font *{
	font-size: 3.2vw;		/* 12px in 375 */
}

.f5_2-font, .f5_2-font *{
	font-size: 2.3467vw;
}


.f5-font, .f5-font *{
	font-size: 1.8933vw;	
}

@media (min-width: 414px) {

	.f1-font, .f1-font *{
		font-size: 23.184px;	
	}

	.f2-font, .f2-font *{
		font-size: 19.872px;	
	}
	.f2_1-font, .f2_1-font *{
		font-size: 18.768px;		
	}
	.f2_2-font, .f2_2-font *{
		font-size: 17.664px; 
	}
	
	
	.f3-font, .f3-font *{
		font-size: 16.56px;	
	}
	
	.f3_5-font, .f3_5-font *{	
		font-size: 15.456px;	
	}
	
	.f4-font, .f4-font *{
		font-size: 13.25px;	
	}
	
	.f5_2-font, .f5_2-font *{
		font-size: 9.715338px;	
	}
	
	.f5-font, .f5-font *{
		font-size: 7.8384px;	
	}
	
}


@media (max-width: 329px) {
	.f1-font, .f1-font *{
		font-size: 17.92px !important;		/* 21px in 375 */
	}
	.f2-font,.title-bar .title, .f2-font *,.title-bar .title *{
		font-size: 15.36px !important;		/*  18px in 375 */	
	}
	.f2_1-font, .f2_1-font *{				/*  17px in 375 */	
		font-size: 14.91px !important;
	}
	.f2_2-font, .f2_2-font *{				/*  16px in 375 */	
		font-size: 14.04px !important;
	}
	.f3-font, .f3-font *{					/*  15px in 375 */
		font-size: 12.8px !important;
	}
	.f3_5-font, .f3_5-font *{	
		font-size: 11.94656px !important;	/* 14px in 375 */		
	}
	
}
@media (min-width: 330px) and (max-width: 339px) {
	.f1-font, .f1-font *{
		font-size: 18.48px !important;		/* 21px in 375 */
	}
	.f2-font,.title-bar .title, .f2-font *,.title-bar .title *{
		font-size: 15.84px !important;		/*  18px in 375 */	
	}
	.f3-font, .f3-font *{
		font-size: 13.2px !important;			/*  15px in 375 */
	}
	.f3_5-font, .f3_5-font *{	
		font-size: 12.31989px !important;	/* 14px in 375 */		
	}
}
@media (min-width: 340px) and (max-width: 349px) {
	.f1-font, .f1-font *{
		font-size: 19.04px !important;		/* 21px in 375 */
	}
	.f2-font,.title-bar .title, .f2-font *,.title-bar .title *{
		font-size: 16.32px !important;		/*  18px in 375 */	
	}
	.f3-font, .f3-font *{
		font-size: 13.6px !important;			/*  15px in 375 */
	}
	.f3_5-font, .f3_5-font *{	
		font-size: 12.69322px !important;	/* 14px in 375 */		
	}
}
@media (min-width: 350px) and (max-width: 359px) {
	.f1-font, .f1-font *{
		font-size: 19.6px !important;		/* 21px in 375 */
	}
	.f2-font,.title-bar .title, .f2-font *,.title-bar .title *{
		font-size: 16.8px !important;		/*  18px in 375 */	
	}
	.f3-font, .f3-font *{
		font-size: 14px !important;			/*  15px in 375 */
	}
	.f3_5-font, .f3_5-font *{	
		font-size: 13.06655px !important;	/* 14px in 375 */		
	}
}
@media (min-width: 360px) and (max-width: 369px) {
	.f1-font, .f1-font *{
		font-size: 20.16px !important;		/* 21px in 375 */
	}
	.f2-font,.title-bar .title, .f2-font *,.title-bar .title *{
		font-size: 17.28px !important;		/*  18px in 375 */	
	}
	.f3-font, .f3-font *{
		font-size: 14.4px !important;			/*  15px in 375 */
	}
	.f3_5-font, .f3_5-font *{	
		font-size: 13.43988px !important;	/* 14px in 375 */		
	}
}
@media (min-width: 370px) and (max-width: 379px) {
	.f1-font, .f1-font *{
		font-size: 20.72px !important;		/* 21px in 375 */
	}
	.f2-font,.title-bar .title, .f2-font *,.title-bar .title *{
		font-size: 17.76px !important;		/*  18px in 375 */	
	}
	.f3-font, .f3-font *{
		font-size: 14.8px !important;			/*  15px in 375 */
	}
	.f3_5-font, .f3_5-font *{	
		font-size: 13.81321px !important;	/* 14px in 375 */		
	}
}
@media (min-width: 380px) and (max-width: 389px) {
	.f1-font, .f1-font *{
		font-size: 21.28px !important;		/* 21px in 375 */
	}
	.f2-font,.title-bar .title, .f2-font *,.title-bar .title *{
		font-size: 18.24px !important;		/*  18px in 375 */	
	}
	.f3-font, .f3-font *{
		font-size: 15.2px !important;			/*  15px in 375 */
	}
	.f3_5-font, .f3_5-font *{	
		font-size: 14.18654px !important;	/* 14px in 375 */		
	}
}
@media (min-width: 390px) and (max-width: 399px) {
	.f1-font, .f1-font *{
		font-size: 21.84px !important;		/* 21px in 375 */
	}
	.f2-font,.title-bar .title, .f2-font *,.title-bar .title *{
		font-size: 18.72px !important;		/*  18px in 375 */	
	}
	.f3-font, .f3-font *{
		font-size: 15.6px !important;			/*  15px in 375 */
	}
	.f3_5-font, .f3_5-font *{	
		font-size: 14.55987px !important;	/* 14px in 375 */		
	}
}
@media (min-width: 400px) and (max-width: 409px) {
	.f1-font, .f1-font *{
		font-size: 22.4px !important;		/* 21px in 375 */
	}
	.f2-font,.title-bar .title, .f2-font *,.title-bar .title *{
		font-size: 19.2px !important;		/*  18px in 375 */	
	}
	.f3-font, .f3-font *{
		font-size: 16px !important;			/*  15px in 375 */
	}
	.f3_5-font, .f3_5-font *{	
		font-size: 14.9332px !important;	/* 14px in 375 */		
	}
}
@media (min-width: 410px) { /* and (max-device-width: 419px) */
	.f1-font, .f1-font *{
		font-size: 23.24px !important;		/* 21px in 375 */
	}
	.f2-font,.title-bar .title, .f2-font *,.title-bar .title *{
		font-size: 19.92px !important;		/*  18px in 375 */	
	}
	.f2-font sup{
		font-size: 14.94px !important;
	}
	.f3-font, .f3-font *{
		font-size: 16.6px !important;			/*  15px in 375 */
	}
	.f3-font sup{
		font-size: 12.45px !important;
	}
	.f3_5-font, .f3_5-font *{	
		font-size: 15.49px !important;	/* 14px in 375 */		
	}
	.f3_5-font sup{
		font-size: 11.62px !important;
	}
}
@media (min-width: 480px) {
	.page-h1, .page-h2 {
		font-size: 24px;
	}
	.body {
		font-size: 16px;
	}
	.body-light {
		font-size: 18px;
	}
	.text-link-red {
		font-size: 16px;
	}

	.plan-title-huge, .plan-total-price {
		font-size: 24px;
	}

	.plan-item-price {
		font-size: 16px;
	}

	.contract-period {
		font-size: 16px;
	}

	.review-item {
		font-size: 22px;
	}
}


.color-g1{
	color: #4d4d4d;
}
.color-g2{
	color: #999999;
}
.color-g3{
	color: #cccccc;
}
.color-g4{
	color: #eeeeee;
}
.color-g5{
	color: #757575;
}
.color-g6{
	color: #7c7c7c;
}
.color-g7{
	color: #7d7d7d;
}
.color-g8{
	color: #868686;
}

.color-blue{
	color: #0000EE;
}

.color-blue2{
	color: #0070E0;
}

.color-r{
	color: #a71c20;
}
.color-r2{
	color: #FF0000;
}
.color-r3{
	color: #dc3545;
}
.color-brown{
	color: #c55a11;
}
.color-o{
	color: #f97817;
}
.color-y{
	color: #febc12;
}
.color-p{
	color: #ffe4ab;
}
.color-w{
	color: white;
}
.color-green{
	color: #28a745;
}

.color-bl{
	color: black;
}
.color-bl2{
	color: #333333;
}


.red-highlight{
	color: #A71C20;	
}

.red-bold-highlight{
	font-weight: bold;
    color: #A71C20;
}

.orange_desc{
	color: #F97817;
}

body{
	text-size-adjust: none;
	/*-webkit-text-size-adjust: none;*/
	-webkit-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: none;
}

.alignLeft{
	text-align: left !important;
}

.alignCenter{
	text-align: center !important;
}

.alignRight{
	text-align: right !important;
}