@charset "utf-8";

/*基本設定ここから*/
.tc { max-width: 980px; margin: 0px auto; text-align:center;}

/*画像共通*/
.tc img { display: block;margin: 0 auto; width:auto!important}
@media screen and (max-width:1024px) {
    .tc img{width:100%!important;}
}

/*要素の余白*/
.fit_t {padding-top:0 !important;}
.fit_b {padding-bottom:0 !important;}
.fit_r {padding-right:0 !important;}
.fit_l {padding-left:0 !important;}
.fit_all {padding:0 !important;}

/*テキスト赤文字*/
.tc strong {color: red;font-weight: normal;}

/*ボックス*/
.tc_box { width:100%; max-width:980px; margin: 20px auto; padding:20px; box-sizing:border-box;}
@media screen and (max-width:1024px) {
.tc_box { margin: 2% auto; padding:2%;}
}

/*インナー*/
.tc_inner { width:100%; padding:0 20px 20px; box-sizing:border-box;}
.tc_inner:first-child { padding:20px;}
:not(.tc_inner)+.tc_inner { padding:20px;}
@media screen and (max-width:1024px) {
.tc_inner { padding:0 2% 2%;}
.tc_inner:first-child { padding:2%;}
:not(.tc_inner)+.tc_inner { padding:2%;}
}

/*インナーの子要素*/
.tc_inner>div { width:100%; padding:0 20px 20px; box-sizing:border-box;}
.tc_inner>div:first-child { padding:20px;}
.tc_inner>:not(div)+div{ padding:20px;}
@media screen and (max-width:1024px) {
.tc_inner>div { padding:0 2% 2%;}
.tc_inner>div:first-child { padding:2%;}
.tc_inner>:not(div)+div{ padding:2%;}
}

/*テキスト*/
.tc_txt { width:100%; font-size:16px; line-height: 1.6em; padding:0 20px 20px; text-align: left; overflow: hidden; box-sizing:border-box;}
.tc_txt:first-child { padding:20px;}
:not(.tc_txt)+.tc_txt { padding:20px;}
@media screen and (max-width:1024px) {
.tc_txt { padding:0 2% 2%;}
.tc_txt:first-child { padding:2%;}
:not(.tc_txt)+.tc_txt { padding:2%;}
}
@media screen and (max-width:640px) {
.tc_txt { font-size:14px;}
}

/*導線上下の余白*/
.tc_btn { margin: 20px auto;}
.tc_btn img { margin: 0 auto;}
@media screen and (max-width:1024px) {
.tc_btn { width:96%; margin: 2% auto;}
}

/*段落上下の余白*/
.par_t { margin-top: 40px;}
.par_b { margin-bottom: 40px;}
@media screen and (max-width:1024px) {
.par_t_d1024-320,
.par_t { margin-top: 4%;}
.par_b_d1024-320,
.par_b { margin-bottom: 4%;}
}

/*シャドウ*/
.tc .sdw{ box-shadow: 3px 3px 2px 0px #9d9d9d;
-moz-box-shadow: 3px 3px 2px 0px #9d9d9d;
-webkit-box-shadow: 3px 3px 2px 0px #9d9d9d;
-ms-box-shadow: 3px 3px 2px 0px #9d9d9d;}

/*吹き出し用シャドウ*/
.tc .sdw.tc_balloon:after { box-shadow: 2px 3px 2px 0px #9d9d9d;
-moz-box-shadow: 2px 3px 2px 0px #9d9d9d;
-webkit-box-shadow: 2px 3px 2px 0px #9d9d9d;
-ms-box-shadow: 2px 3px 2px 0px #9d9d9d;
}

/*テキスト右側 sp画像w50%表示*/
.txt_r_1per2 p img { float: left; width: auto !important; margin: 0 20px 20px 0;}
/*テキスト右側 sp画像w33%表示*/
.txt_r_1per3 p img { float: left; width: auto !important; margin: 0 20px 20px 0;}

/*テキスト左側 sp画像w50%表示*/
.txt_l_1per2 p img { float: right; width: auto !important; margin: 0 0 20px 20px;}
/*テキスト左側 sp画像w33%表示*/
.txt_l_1per3 p img { float: right; width: auto !important; margin: 0 0 20px 20px;}

@media screen and (max-width:1024px) {
.txt_r_1per2 p img,
.txt_l_1per2 p img { max-width: 50% !important;}
.txt_r_1per2 p img,
.txt_r_1per3 p img { margin: 0 2% 2% 0;}
.txt_l_1per2 p img,
.txt_l_1per3 p img { margin: 0 0 2% 2%;}
}
@media screen and (max-width:640px) {
.txt_r_1per3 p img,
.txt_l_1per3 p img { max-width: 30% !important;}
}

/*導線テンプレート用、等分テンプレート用共通*/
.tc .cnt_box_inner { max-width: 980px; padding: 0 10px; box-sizing: border-box;}
.tc .is_1per1 div { padding: 0 10px;}
@media screen and (max-width:1024px) {
.tc .cnt_box_inner,
.tc .is_1per1 div { padding: 0 1%;}
}
/*2,3,4カラム*/
.tc .is_1per2 li,
.tc .is_1per3 li,
.tc .is_1per4 li { padding: 0 10px;}
.tc .is_1per3 li {	width : 33.33333% ; width : -webkit-calc(100% / 3) ; }
@media screen and (max-width:1024px) {
.tc .is_1per2 li,
.tc .is_1per3 li,
.tc .is_1per4 li { padding: 0 1%;}
}
@media screen and (max-width:640px) {
.tc .is_1per4 li { margin-bottom: 2%;}
.tc .is_1per4 li:last-child,
.tc .is_1per4 li:nth-last-child(2) { margin-bottom: 0;}
}
/*2,3カラム リキッド*/
@media screen and (max-width:640px) {
.tc .is_1per2.tc_riquid li,
.tc .is_1per3.tc_riquid li { width: 100%; float:none;}
}
/*基本設定ここまで*/




/* Phone Landscape (640px) */
.d-640 {display:block!important;}
.d640-320 {display:none!important;}

@media screen and (max-width:640px) {
.d-640 {display:none!important;}
.d640-320 {display:block!important;}
}



/*LINEキャンペーンはここから*/
.pg_line-fnd {font-size: 13px}
.pg_line-fnd_bg {background: url(../../line-fnd/images/line_bg.jpg) repeat scroll 0 0}
.pg_line-fnd_last {
    position: relative;
    background-image: url(../../line-fnd/images/line_bg_last_pc.png);
    background-position: center bottom;
    background-repeat: no-repeat;
    padding-bottom: 29%;
    -moz-background-size: 100% auto;
    background-size: 100% auto;
}

@media screen and (max-width:640px) {
	.pg_line-fnd_last{background-color: #ecf7f8; background-image: url(../../line-fnd/images/line_bg_last_sp.png);padding-bottom: 59%;}
}


.pg_line-fnd_bgwhite{background: #ffffff;}
.pg_line-fnd_top {position:relative;}
.pg_line-fnd_top div{z-index: 1;
    color: #3caa00;
    margin: 0 auto;
    font-size: 300%;
    position: absolute;
    top: 15%;
    left: 0;
    width: 100%;}
.pg_line-fnd_top div br{display: none}
@media screen and (max-width:640px) {
	.pg_line-fnd_top div{font-size: 220%;top: 9%;line-height:120%;}
    .pg_line-fnd_top div br{display: block}
}

.pg_line-fnd_balloon{position: relative;
	display: inline-block;
	padding: 5px 5px;
	width: 660px;
	color: #ffffff;
	line-height: 40px;
	text-align: center;
	background: #f5a431;
	font-size: 185%;}
.pg_line-fnd_balloon:after {
	content: "";
	position: absolute;
	bottom: -20px;
	left: 47%;
	margin-left: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 20px 20px 0 20px;
	border-color: #f5a431 transparent transparent transparent;
}
@media screen and (max-width:640px) {
	.pg_line-fnd_balloon{margin: 2% 2% 7%;padding: 1% 5%;font-size: 140%;width: 86%}
}

.pg_line-fnd_webfont{font-family: "Noto Sans Japanese";font-weight: 900;}
}
.list-links {
	width: 100%;
}

.list-links > li {
	position: relative;
}
.list-links > li::before {
    position: absolute;
    content: "";
    top: 10%;
    left: 10px;
    width: 117px;
    height: 112px;
    margin-top: -5px;
    background: url(../../line-fnd/images/line_benefit_icon.png) top left no-repeat;
    background-size: 117px 112px;
}
.list-links > li>div {
	display: block;
    position: relative;
    margin: 0 0 30px 140px;
    font-size: 224%;
    color: #e6007e;
    background: #fff8b8;
    text-align: left;
    height: 124px;
    padding-left: 20px;
    padding-right: 20px;
}
.list-links > li>div>div{display:table-cell;vertical-align: middle;height: 124px;;font-weight: 900;font-family: "Noto Sans Japanese"}


.list-links > li:last-child::before {
    background: url(../../line-fnd/images/line_benefit_more.png) top left no-repeat;
}
.list-links > li:last-child>div>div{vertical-align: bottom;height: 80px;}
.list-links > li>div>p{font-size:50%;text-align:right;width:100%;padding-top: 2%;}

@media screen and (max-width:640px) {
	.list-links > li::before{top: 21%;width: 50%;background-size:29% auto;}
	.list-links > li>div{font-size: 114%;margin: 0 0 30px 19%;height: auto;padding-right: 2%;padding-left: 2%;}
	.list-links > li:last-child::before{background: url(../../line-fnd/images/line_benefit_more.png) top left no-repeat;background-size:29% auto;}
	.list-links > li:last-child>div{position: relative;height: 2px;
    padding-bottom: 19%}
	.list-links > li:last-child>div>div{height: auto;
    position: absolute;
    top: 34%;}
	.list-links > li>div>div{height: 60px}
	.list-links > li>div>p{padding-top: 18%;}
}





.pg_line-fnd_addttl{border-radius: 5px;background: #45b10b;color: #fff;padding: 20px;font-size: 240%}
@media screen and (max-width:640px) {
	.pg_line-fnd_addttl{font-size: 200%;}
}

.pg_line-fnd_addbnr div{margin: 0 auto}
.pg_line-fnd_addbnr div:first-child{width:85%}
.pg_line-fnd_addbnr div:last-child{font-size: 130%; padding-top: 2%;color: #666666;}
.pg_line-fnd_qrcode{width:85%;margin:0 auto;}
.pg_line-fnd_qrcode div:first-child{float: left;text-align: left;width:23%;}
.pg_line-fnd_qrcode div:last-child{float:right;font-size: 240%;color: #666666;width:75%;text-align: left; padding-top: 3%;}
@media screen and (max-width:1024px) {
.pg_line-fnd_qrcode{width:90%;}
.pg_line-fnd_qrcode div:last-child{font-size: 210%; padding-top: 2%;}
}