@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);

/*-------------------------------------
メイン
---------------------------------------*/
#container {
	width: 100%;
}
.column2R #main {
	float: none;
	width: auto;
}
html {
	overflow: auto;
}
body {
	overflow-x: hidden;
	position: relative;
	min-width: 805px;
}
* html body { /* for IE6 */
	overflow-y: auto;
	height: 100%;
}
.pc {display: block;}
.sp {display: none;}

#mainContents {
	background-color:#FFF;
  color: #333;
  font-family: 'Noto Sans JP', sans-serif;
	font-size: 16px;
  line-height: 1.4;
	margin: 0 auto;
}
#mainContents > .title {
	background: #e1f8ff url("./img/extended-warranty-popup/img_kv.webp") center 0 no-repeat;
	min-height: 452px;
	border-bottom: 5px solid #2751a2;
}
#mainContents > .title > .title__inner {
  margin: 0 auto;
  width: 960px;
}
#mainContents > .title > .title__inner h2 {
	padding-top: 50px;
}
#mainContents > .block > .block-inner {
  margin: 0 auto;
  width: 960px;
	padding: 80px 0;
}
#mainContents > .block.color-02 {
	width: 100%;
	margin: 0 -555%;
	padding: 0 555%;
	background: #e6e6e6;
}
#mainContents > .block.color-03 {
	background: #17499d;
}
#mainContents > .block.color-03 > .block-inner {
	padding: 60px 0;
}
#mainContents > .block p {
	line-height: 1.6;
	font-size: 120%;
}
#mainContents > .block p em {
	font-size: 150%;
}
#mainContents > .block p.attention {
	font-size: 100%;
	margin-top: 40px;
}
#mainContents > .block .ttl_point span {
	display: inline-block;
	color: #fff;
	background: #fe4c1a;
	font-size: 24px;
	line-height: 1;
	padding: 10px 15px;
	margin-right: 20px;
}
#mainContents > .block .ttl_point {
	font-weight: bold;
	font-size: 32px;
	min-height: 50px;
	padding-top: 25px;
	padding-bottom: 27px;
	margin-bottom: 20px;
}
.block h3.ttl_point.point-01 {
	background: url("./img/extended-warranty-popup/img_icon_01.webp") right 0 no-repeat;
	letter-spacing: -0.8px;
}
.block h3.ttl_point.point-02 {
	background: url("./img/extended-warranty-popup/img_icon_02.webp") right 0 no-repeat;
}
.block h3.ttl_point.point-03 {
	background: url("./img/extended-warranty-popup/img_icon_03.webp") right 0 no-repeat;
}
.block h3.ttl_point.point-04 {
	background: url("./img/extended-warranty-popup/img_icon_04.webp") right 0 no-repeat;
}
.block h3.ttl_point.point-05 {
	background: url("./img/extended-warranty-popup/img_icon_05.webp") right 0 no-repeat;
}
#mainContents > .block.color-03 h3 {
	text-align: center;
}

#mainContents .box_price-ex {
	background: #eee;
	padding: 20px;
	margin-top: 60px;
}
#mainContents .block h3.ttl_price {
	font-weight: bold;
	font-size: 36px;
	margin-bottom: 40px;
}
#mainContents .box_price-ex h4.ttl_price-ex {
	font-size: 24px;
	margin-bottom: 10px;
}

#mainContents p.attention span.font-l {
	font-size: 120%;
}
#mainContents p.btn_kiyaku {
    margin-top: 20px;
}

#mainContents p.btn_kiyaku a {
	display: inline-block;
	background: #fff;
	border: 2px solid #17499D;
	color: #17499D;
	padding: 5px 10px;
	text-decoration: none!important;
}
#mainContents p.btn_kiyaku a:hover {
	text-decoration: underline!important;
}
#mainContents .block.safety {
	background: #cbecf8;
}
#mainContents .block.safety p.text em {
	font-size: 110%;
	letter-spacing: -0.5px;
}
#mainContents > .block.safety > .block-inner div {
	display: flex;
	justify-content: space-between;
}


/*-------------------------------------
ヘッダーとフッターは非表示
---------------------------------------*/
#Header {
	display:none;
}
#Globalnavi {
	display:none;
}
body div.leadSection {
	display:none;
}
.footerTagline {
	display:none;
}
#footer {
	display:none;
}
#footerLinks,
#footerCopy .footerBtn {
	display:none;
}

/* 20180518 ロゴとコピーライトのみ表示  */
#footerCopy .copyright {
    text-align: center;
    color: #605b5a;
}
#footerCopy .copyright a {
    cursor: default;
}
#footerCopy .copyright a:hover img {
  opacity: 1.0;
}

/*-------------------------------------
ページトップ
---------------------------------------*/
#pagetop {
  bottom: 30px;
  display: none;
  position: fixed;
  right: 55px;
}

#pagetop a {
  background-color: #333;
  border-radius: 5px;
  color: #fff;
  display: block;
  font-size: 12px;
  line-height: 1.5em;
  padding: 5px 10px;
  text-align: center;
  text-decoration: none;
}

/*-------------------------------------
閉じるボタン
---------------------------------------*/

.closeBtn {
	text-align:center;
	margin:50px 0;
}

.closeBtn input {
	background: -moz-linear-gradient(top,#F60 0%,#F30);
	background: -webkit-gradient(linear, left top, left bottom, from(#F60), to(#F30));
	background: linear-gradient(to bottom, #F60, #F30);
	border: 1px solid #DDD;
	border-radius:5px;
	color:#FFF;
	font-weight:bold;
	padding: 10px 100px;
	text-decoration:none;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:18px;
  cursor: pointer;
}
.closeBtn input:not(:target) {
	background:#F30\9;
}
.closeBtn input {
	background:#F30\9;
}
.closeBtn input:hover {
	opacity: 0.7;
}
.table_sp, .img_sp {
	display: none;
}

/*-------------------------------------
こっからしたはclearfix
---------------------------------------*/
.clearfix:after {
	content: ".";  /* 新しい要素を作る */
	display: block;  /* ブロックレベル要素に */
	clear: both;
	height: 0;
	visibility: hidden;
}
.clearfix {
	min-height: 1px;
}
* html .clearfix {
	height: 1px;/*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
}

/*-------------------------------------
　SP （0〜479pxの場合に適用するCSS）
---------------------------------------*/
@media screen and (max-width:479px){
	.pc {display: none;}
	.sp {display: block;;}

	img {
		max-width: 100%;
	}
	#mainContents > .title {
		background-size: auto 120%;
		min-height: auto;
	}
	#mainContents > .title > .title__inner,
	#mainContents > .block >.block-inner {
	  width: auto;
	}
	#mainContents > .block.color-03 > .block-inner {
		padding: 30px 0;
	}
	#mainContents > .block > .block-inner {
	  margin: 0 10px;
		padding: 40px 0 50px;
	}
	#mainContents > .title > .title__inner h2 {
		width: 40%;
    padding-left: 5px;
		padding-top: 0;
		padding-top: 15px;
		padding-left: 10px;
    padding-bottom: 10px;
	}
#mainContents > .block .ttl_point span {
	font-size: 5vw;
	padding: 8px 10px;
	margin-right: 10px;
	}
#mainContents > .block .ttl_point {
		min-height: 70px;
    font-size: 6vw;
		padding-right: 80px;
		background-size: auto 70px;
		padding-top: 0;
		padding-bottom: 0;
    line-height: 1.6;
	}
	#mainContents .block h3.ttl_price {
		font-size: 7.5vw;
	}
	#mainContents > .block.safety > .block-inner div {
		display: block;
	}

#mainContents .block.safety p.text {
	margin-bottom: 20px;
}

/*-------------------------------------
閉じるボタン
---------------------------------------*/
.closeBtn {
	margin: 30px 0;
}
.closeBtn input {
	background: -moz-linear-gradient(top,#F60 0%,#F30);
	background: -webkit-gradient(linear, left top, left bottom, from(#F60), to(#F30));
	background: linear-gradient(to bottom, #F60, #F30);
	border: 1px solid #DDD;
	border-radius:5px;
	color:#FFF;
	font-weight:bold;
	padding: 10px 0;
	width: 90%;
	text-decoration:none;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:18px;
}


}