
@charset "Shift_JIS";

/* =================================================================================================
　永久不滅ポイントサイト - ショッピングガイド
　https://www.a-q-f.com/
　Copyright (C) CREDIT SAISON CO.,LTD. All Right Reserved.
================================================================================================= */


/* ----------------------------------------------------------------------------
　メインエリア
---------------------------------------------------------------------------- */
#main_area{
	background-color:#0f218b;
	min-height:232px;
}

/* 1200px以下 */
@media print, screen and (max-width:1200px){
#main_area{
	min-height:auto;
}
}

#main_area .liquid{
	position:relative;
}
#main_area h1{
	width:62.22222222222222222222222222%;
	float:left;
	position:relative;
}
#main_area h1 img{
	width:100%;
}
#main_area .text{
	width:33%;
	float:right;
	font-size:14px;
	letter-spacing:1px;
	line-height:200%;
	color:#fff;
	padding:60px 0 60px;
}

/* 1300px以下 */
@media print, screen and (max-width:1288px){
#main_area .text{
	padding:50px 0 50px;
}
}
/* 1200px以下 */
@media print, screen and (max-width:1200px){
#main_area .text{
	padding:40px 0 40px;
}
}
/* 1100px以下 */
@media print, screen and (max-width:1100px){
#main_area .text{
	padding:25px 0 25px;
}
}


/* ----------------------------------------------------------------------------
　アンカー
---------------------------------------------------------------------------- */
#guide #anchor{
	width:940px;
	padding:6px 0 4px;
	background-color:#dbecff;
	margin:35px auto 0;
	text-align:center;
	margin-bottom:30px;
	border-radius: 100px;
}
#guide #anchor ul{
	text-align:center;
}
#guide #anchor li{
	display:inline-block;
	margin:0 20px 0;
}
#guide #anchor li a{
	font-size:14px;
	color:#333;
	display:inline-block;
	background: url("/common/pc/img/about/point/point_anchor_arrow.jpg") right center no-repeat;
	padding:0 25px 0 0;
}




/* ----------------------------------------------------------------------------
　ポイントが貯まる仕組み
---------------------------------------------------------------------------- */
#mechanism{
	padding:30px 0 50px;
	background-color:#fff;
}


/* タイトル */
#mechanism .title_area{
	margin:0 0 50px;
	position:relative;
}
#mechanism .title_area h2{
	font-size:36px;
	font-weight:bold;
	line-height:120%;
	color:#0f218b;
	text-align:center;
}
#mechanism .title_area h2 span{
	background: url("/common/pc/img/about/shopping/mechanism_title_icon.png") 0 0 no-repeat;
	height:59px;
	padding:21px 0 0 95px;
	display:inline-block;
}

#mechanism .lead{
	font-size:18px;
	text-align:center;
	margin-bottom:45px;
}

#mechanism h3{
	font-size:30px;
	line-height:120%;
	color:#ed51a1;
	text-align:center;
	background: url("/common/pc/img/about/shopping/mechanism_title_line.jpg") center bottom no-repeat;
	padding-bottom:50px;
	margin-bottom:25px;
}


/* chart2 */
#mechanism .chart2{
	margin-bottom:45px;
	position:relative;
}

/* via */
#mechanism .chart2 .via{
	width:67.858%;
	float:left;
	background-color:#daeaf3;
	border-radius: 5px 5px 0 0;
}
/* novia */
#mechanism .chart2 .novia{
	width:29.76190476%;
	float:right;
	background-color:#f5f5f5;
	border-radius: 5px 5px 0 0;
}


#mechanism .chart2 .title{
	font-size:22px;
	line-height:120%;
	text-align:center;
	color:#fff;
	padding:22px 0 18px;
	border-radius: 3px 3px 0 0;
}
#mechanism .chart2 .title span{
	font-size:18px;
}

/* 1200px以下 */
@media print, screen and (max-width:1200px){
	#mechanism .chart2 .title{
		font-size:22px;
	}
	
	#mechanism .chart2 .novia .title{
		padding:24px 0 16px;
	}
}
/* 1100px以下 */
@media print, screen and (max-width:1100px){
	#mechanism .chart2 .title{
		font-size:20px;
	}
}


#mechanism .chart2 .via .title{
	background-color:#0f218b;
}
#mechanism .chart2 .via .title img{
	position:relative;
	top:-2px;
}
#mechanism .chart2 .via dl dt{
	background-color:#0671b0;
}
#mechanism .chart2 .via dl dt.arrow{
	background: url("/common/pc/img/about/shopping/mechanism_chart_via_arrow.jpg") center 0 no-repeat;
	background-color:#0671b0;
}


#mechanism .chart2 .novia .title{
	background-color:#555555;
}
#mechanism .chart2 .novia dl dt{
	background-color:#bcbcbc;
}
#mechanism .chart2 .novia dl dt.arrow{
	background: url("/common/pc/img/about/shopping/mechanism_chart_novia_arrow.jpg") center 0 no-repeat;
	background-color:#bcbcbc;
}


#mechanism .chart2 dl dt{
	font-size:18px;
	line-height:chart2 clearfix120%;
	font-weight:bold;
	color:#fff;
	text-align:center;
	padding:16px 0 14px;
}


/* 1200px以下 */
@media print, screen and (max-width:1200px){
	#mechanism .chart2 dl dt{
		font-size:16px;
	}
}
/* 1100px以下 */
@media print, screen and (max-width:1100px){
	#mechanism .chart2 dl dt{
		font-size:14px;
	}
}


#mechanism .chart2 dl dd{
	text-align:center;
}
#mechanism .chart2 dl dd img{
	width:100%;
}

#mechanism .chart2 .bottom_space{
	padding-bottom:27%;
}


/* shop */
#mechanism .chart2 .shop{
	width:92.06349206%;
	position:absolute;
	top:54%;
	left:4%;
	background-color:#f0f5e9;
}
#mechanism .chart2 .shop dt{
	background: url("/common/pc/img/about/shopping/mechanism_chart_shop_arrow.jpg") center 0 no-repeat;
	background-size:100% auto;
	background-color:#298002;
	position:relative;
}
#mechanism .chart2 .shop dt span{
	font-size:12px;
	position:absolute;
	right:18px;
	bottom:10px;
}
#mechanism .chart2 .shop dd{
	border:1px solid #298002;
	padding:2.2% 0;
}
#mechanism .chart2 .shop dd ul{
	text-align:center;
}
#mechanism .chart2 .shop dd ul li{
	width:85px;
	display:inline-block;
	margin:0 3px;
}

/* 1200px以下 */
@media print, screen and (max-width:1200px){
	#mechanism .chart2 .shop{
		top:55%;
	}
	#mechanism .chart2 .shop dd ul li{
		width:70px;
	}
}
/* 1100px以下 */
@media print, screen and (max-width:1100px){
	#mechanism .chart2 .shop{
		top:55%;
	}
	#mechanism .chart2 .shop dd ul li{
		width:60px;
	}
}

#mechanism .chart2 .shop img{
	width:100%;
	height:auto;
}



#mechanism h4{
	text-align:center;
	background: url("/common/pc/img/about/shopping/mechanism_title_line.jpg") center bottom no-repeat;
	padding-bottom:70px;
	margin-bottom:25px;
}
#mechanism h4 .text01{
	text-align:center;
	margin-bottom:35px;
}
#mechanism h4 .text01 img{
	width:80.63492063%;
}
#mechanism h4 .text02{
	font-size:24px;
	font-weight:bold;
	text-align:center;
}
#mechanism h4 .text02 span{
	font-size:18px;
}
#mechanism .bnr img{
	width:100%;
}


/* ----------------------------------------------------------------------------
　インターネットショッピングのご利用方法
---------------------------------------------------------------------------- */
#howto{
	padding:55px 0 50px;
	background-color:#f5f5f5;
}

/* タイトル */
#howto .title_area{
	margin:0 0 50px;
	position:relative;
}
#howto .title_area h2{
	font-size:36px;
	font-weight:bold;
	line-height:120%;
	color:#0f218b;
	text-align:center;
}
#howto .title_area h2 span{
	background: url("/common/pc/img/about/shopping/howto_title_icon.png") 0 0 no-repeat;
	height:59px;
	padding:21px 0 0 95px;
	display:inline-block;
}

/* 各STEP共通 */
#howto .step{
	background-color:#fff;
	border-radius: 5px;
	padding:0 30px 30px;
	margin-bottom:30px;
}
#howto .step:last-child{
	margin-bottom:0px;
}
#howto .step .icon{
	text-align:center;
	margin-bottom:30px;
}
#howto .step h3{
	text-align:center;
	font-size:24px;
	font-weight:bold;
	line-height:120%;
	color:#0f218b;
	margin-bottom:30px;
}

/* STEP1 */
#howto .step1 .chart{
	position:relative;
}
#howto .step1 .chart img{
	width:100%;
}
#howto .step1 .chart .text{
	font-size:18px;
	line-height:120%;
	position:absolute;
	top:1%;
	left:28%;
}

/* 1200px以下 */
@media print, screen and (max-width:1200px){
	#howto .step1 .chart .text{
		font-size:16px;
	}
}
/* 1100px以下 */
@media print, screen and (max-width:1100px){
	#howto .step1 .chart .text{
		font-size:14px;
	}
}


/* STEP2 */
#howto .step2 .text{
	text-align:center;
	margin-bottom:35px;
	position:relative;
}
#howto .step2 .text span{
	position:absolute;
	top:0px;
	right:0px;
}
#howto .step2 .shop_list{
	text-align:center;
}
#howto .step2 .shop_list li{
	display:inline-block;
	margin:0 4px;
}


/* STEP3 */
#howto .step3 .text{
	text-align:center;
	margin-bottom:35px;
	position:relative;
}
#howto .step3 .chart{
	margin-bottom:35px;
}
#howto .step3 .chart img{
	width:100%;
}
#howto .step3 .double{
	border-radius: 5px;
	background-color:#f5f5f5;
	padding:35px 0 30px;
	margin-bottom:40px;
}
#howto .step3 .double h4{
	text-align:center;
	margin-bottom:20px;
}
#howto .step3 .double h4 span{
	font-weight:bold;
	color:#005b9f;
	margin-right:30px;
}
#howto .step3 .double img{
	width:100%;
}


/* STEP4 */
#howto .step4 .text{
	text-align:center;
	margin-bottom:35px;
}
#howto .step4 .chart{
	position:relative;
}
#howto .step4 .chart img{
	width:100%;
}
#howto .step4 .chart .text1,
#howto .step4 .chart .text2{
	text-align:center;
	position:absolute;
	bottom:10%;
	z-index:2;
	width:48%;
	font-weight:bold;
}
#howto .step4 .chart .text1{
	left:0px
}
#howto .step4 .chart .text2{
	right:0px
}
/* 1200px以下 */
@media print, screen and (max-width:1200px){
#howto .step4 .chart .text1,
#howto .step4 .chart .text2{
	font-size:16px !important;
}
}

/* 1100px以下 */
@media print, screen and (max-width:1100px){
#howto .step4 .chart .text1,
#howto .step4 .chart .text2{
	font-size:14px !important;
}
}

/* STEP5 */
#howto .step5 .text{
	text-align:center;
	margin-bottom:35px;
}
#howto .step5 .chart{
	position:relative;
}
#howto .step5 .chart img{
	width:100%;
}
#howto .step5 .btn_white{
	margin-top:40px;
}


/* ----------------------------------------------------------------------------
　お買物の便利な機能
---------------------------------------------------------------------------- */
#function{
	padding:55px 0 50px;
	background-color:#fff;
}

/* タイトル */
#function .title_area{
	margin:0 0 50px;
	position:relative;
}
#function .title_area h2{
	font-size:36px;
	font-weight:bold;
	line-height:120%;
	color:#0f218b;
	text-align:center;
}
#function .title_area h2 span{
	background: url("/common/pc/img/about/shopping/function_title_icon.png") 0 0 no-repeat;
	height:59px;
	padding:21px 0 0 95px;
	display:inline-block;
}
#function .lead{
	margin-bottom:40px;
	text-align:center;
	line-height:180%;
}


#function .tool dt,
#function .favorite dt{
	text-align:center;
	color:#fff;
	font-size:18px;
	line-height:120%;
	font-weight:bold;
	background-color:#0f218b;
	padding:19px 0 17px;
	border-radius: 2px 2px 0 0;
}
#function .tool dt span{
	font-size:14px;
}
#function .tool dd,
#function .favorite dd{
	padding:30px 0;
}

/* ツールバー */
#function .tool{
	width:59.52380952%;
	float:left;
	background-color:#f5f5f5;
}
#function .tool .chart{
	margin-bottom:50px;
}
#function .tool .chart img{
	width:100%;
}
#function .tool .btn_white a{
	width:55%;
}
#function .tool .text{
	text-align:center;
	margin:30px 10px 0;
}
#function .tool .text span{
}


/* お気に入り登録 */
#function .favorite{
	width:38.09523809%;
	float:right;
	background-color:#f5f5f5;
}
#function .favorite .chart{
	margin-bottom:50px;
}
#function .favorite .chart img{
	width:100%;
}
#function .favorite .btn_white a{
	width:85%;
}
#function .favorite .text{
	text-align:center;
	margin:30px 10px 0;
}


/* ----------------------------------------------------------------------------
　お気に入りモーダル
---------------------------------------------------------------------------- */
#favorite_modal{
	width:860px;
	position:fixed;
	top:0px;
	left:0px;
	z-index:101;
	padding-top:245px;
	display:none;
}
#favorite_modal .inner{
	border:10px solid #13185f;
	background-color:#fff;
	padding:70px 70px 100px;
	position:relative;
}
#favorite_modal .inner .btn_close{
	position:absolute;
	top:10px;
	right:10px;
}
#favorite_modal .inner .btn_close a:hover{
	opacity: 0.8;
}
#favorite_modal .inner2{
	position:relative;
	padding:10px 0 0 137px;
}
#favorite_modal .inner2 .arrow{
	position:absolute;
	top:-325px;
	left:8px;
}
#favorite_modal .inner2 .logo{
	position:absolute;
	top:0px;
	left:0px;
}
#favorite_modal .inner2 .title{
	margin-bottom:20px;
}
#favorite_bg{
	width:100%;
	height:100%;
	position:fixed;
	z-index:100;
	top:0px;
	left:0px;
	display:none;
	
	background: url("/common/pc/img/about/top_favorite_bg.png") 0 0;
}



/* ----------------------------------------------------------------------------
　インターネットショピングを始めてみよう
---------------------------------------------------------------------------- */
#start{
	padding:55px 0 50px;
	background-color:#f5f5f5;
}

/* タイトル */
#start .title_area{
	margin:0 0 50px;
	position:relative;
}
#start .title_area h2{
	font-size:36px;
	font-weight:bold;
	line-height:120%;
	color:#0f218b;
	text-align:center;
}
#start .title_area h2 span{
	background: url("/common/pc/img/about/shopping/start_title_icon.png") 0 0 no-repeat;
	height:59px;
	padding:21px 0 0 95px;
	display:inline-block;
}

#start .lead{
	margin-bottom:40px;
	text-align:center;
	line-height:180%;
}

/* 検索 */
#start .shop_search{
	width:900px;
	margin:0 auto 60px;
}
#start .shop_search .form_text{
	width:579px;
	height:18px;
	padding:20px;
	float:left;
	border:none;
	background-color:#fff;
	border:1px solid #eaeaea;
	border-right:none;
	border-radius: 3px 0 0 3px;
	color:#999;
	font-size:14px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro" , "メイリオ" , Meiryo ,"ＭＳ Ｐゴシック", Osaka, sans-serif;
}
#start .shop_search .form_text_on{
	color:#333;
}

#start .shop_search .form_submit{
	width:280px;
	height:60px;
	float:right;
	border:none;
	background:none;
	text-indent:-9999px;
	background: url("/common/pc/img/about/shopping/start_form_submit.jpg") 0 0 no-repeat;
	cursor:pointer;
}
#start .shop_search .form_submit:hover{
	opacity: 0.8;
}

/* ショップ一例 */
#start h3{
	font-size:24px;
	line-height:120%;
	font-weight:bold;
	color:#0f218b;
	text-align:center;
}

#start .shop_list{
	margin-top:60px;
}
#start .shop_list dl{
	width:49%;
	float:left;
	position:relative;
}
#start .shop_list dl:last-child{
	width:49%;
	float:right;
}

#start .shop_list dl dt{
	width:100%;
	position:absolute;
	top:-20px;
	left:0px;
}
#start .shop_list dl dt a{
	display:block;
	background: url("/common/pc/img/about/shopping/start_shop_list_title.jpg") right center no-repeat;
	background-color:#0671b0;
	font-size:14px;
	line-height:120%;
	font-weight:bold;
	color:#fff;
	text-align:center !important;
	width:50%;
	height:30px !important;
	padding-top:15px !important;
	margin:0 auto !important;
	border-radius: 5px;
}
#start .shop_list dl dt a:hover{
	opacity: 0.8;
	text-decoration:none;
}

#start .shop_list dl dd{
	border:1px solid #dfdfdf;
	background-color:#fff;
	padding:50px 0 20px;
}
#start .shop_list dl dd ul{
	text-align:center;
}
#start .shop_list dl dd ul li{
	width:28%;
	margin:0 2%;
	display:inline-block;
	vertical-align:top;
}
#start .shop_list dl dd ul li a{
	display:block;
	color:#333;
}
#start .shop_list dl dd ul li .logo{
	text-align:center;
	margin-bottom:15px;
}
#start .shop_list dl dd ul li .logo img{
}
#start .shop_list dl dd ul li .logo_title{
	text-align:center;
	font-size:14px;
	font-weight:bold;
}

#start .btn_white{
	margin-top:40px;
}



/* ----------------------------------------------------------------------------
　ログインしてセゾンポイントモールを利用しよう！
---------------------------------------------------------------------------- */
#use{
	padding:55px 0 0px;
	background-color:#fff;
}

/* タイトル */
#use .title_area{
	margin:0 0 50px;
	position:relative;
}
#use .title_area h2{
	font-size:36px;
	font-weight:bold;
	line-height:120%;
	color:#0f218b;
	text-align:center;
}
#use .title_area h2 span{
	background: url("/common/pc/img/about/shopping/use_title_icon.png") 0 0 no-repeat;
	height:59px;
	padding:21px 0 0 95px;
	display:inline-block;
}

#use .lead{
	font-size:18px;
	text-align:center;
	margin-bottom:20px;
}
#use .lead02{
	font-size:16px;
	text-align:center;
	margin-bottom:35px;
}
#use .lead02 span{
	background: url("/common/pc/img/about/top_use_beginner.png") 0 center no-repeat;
	padding:4px 0 4px 25px;
}
#use .lead02 span a{
	color:#005b9f;
	text-decoration:underline;
}
#use .lead02 span a:hover{
	color:#005b9f;
	text-decoration:none;
}


.login_area{
	padding:50px 35px 40px;
	background: url("/common/pc/img/about/shopping/use_login_area_bg.jpg") right 0 no-repeat;
	background-color:#f5f5f5;
	
	border-radius: 3px;
}
#guide .login_area .status{
	font-size:24px;
	color:#ee51a2;
	text-align:center;
	margin-bottom:45px;
}
.login_area .inner{
	background-color:#fff6fb;
	border-radius: 3px;
	padding:40px 60px 30px;
}
#guide .login_area h3{
	text-align:center;
	font-size:24px;
	margin-bottom:35px;
}

#guide .login_area .type{
	margin-bottom:40px;
}
#guide .login_area .type li{
	width:32%;
	float:left;
	margin-right:2%;
	background-color:#fff;
	padding:15px 0;
	border-radius: 3px;
}
#guide .login_area .type .lastItem{
	margin-right:0%;
}
#guide .login_area .type li .photo{
	text-align:center;
	margin-bottom:10px;
}
#guide .login_area .type li .title{
	text-align:center;
	font-size:14px;
	letter-spacing:-0.5px;
}


#guide .login_area .other_link{
	text-align:center;
}
#guide .login_area .other_link li{
	display:inline-block;
	margin:30px 50px 0;
}
#guide .login_area .other_link li a{
	color:#333;
	font-size:14px;
	text-decoration:underline;
}
#guide .login_area .other_link li a:hover{
	text-decoration:none;
}


#guide .login_area_arrow{
	width:100%;
	height:33px;
	margin-bottom:25px;
	background: url("/common/pc/img/about/top_use_login_area_arrow.jpg") center 0 no-repeat;
}


#use h4{
	font-weight:bold;
	text-align:center;
	font-size:24px;
	letter-spacing:-1px;
}



/* ----------------------------------------------------------------------------
　注意文
---------------------------------------------------------------------------- */
#attention{
	padding:20px 0 50px;
	font-size:14px;
	line-height:180%;
}
#attention li{
    padding-left: 1em;
    text-indent: -1em;
}
#attention li a{
	color:#333;
	text-decoration:underline;
}
#attention li a:hover{
	text-decoration:none;
}





