@charset "Shift_JIS";

/* =======================================================================
#suntory_contents 背景色
======================================================================= */
#suntory_contents{background:#fff;}


/* =======================================================================
#suntory_contents #container 横幅、メイン画像
======================================================================= */
#container{
width:960px;
padding-bottom:35px;
}

#container h1{
margin-bottom:20px;
}

#container h1 img{
width:100%;
}

@media screen and (max-width:767px){
#container{width:100%;}
}


/* =======================================================================
FONT-SIZE 一括変更 初期設定 PC-13px SP-14px
======================================================================= */
#contents_hd,#form_wrapper .box,#contents .type_msg{font-size:13px;}

@media screen and (max-width:767px){
#contents_hd,#form_wrapper .box,#contents .type_msg{font-size:14px;}
}


/* =======================================================================
#contents #contents_hd メイン画像下 応募要項等 フリーカスタムエリア
======================================================================= */
#contents_hd{
padding:0 5px 40px 5px;
color:#333;
}

/* #contents_hd .lead_caution
============================================================ */
#contents_hd .lead_caution{
background:#fff;
border:2px solid #e11;
padding:12px 10px 8px 10px;
}

#contents_hd .lead_caution ul li{
text-indent:-1em;
margin-left:1em;
padding-bottom:0.5em;
color:#e11;
}

/* #contents_hd #outline_area
============================================================ */
#contents_hd #outline_area h2,
#contents_hd #outline_area dl dt{
font-weight:bold;
margin-bottom:0.4em;
color:#1A0504;
}

#contents_hd #outline_area h2{
margin-top:1em;
}

#contents_hd #outline_area h2:before{
content:"\0025cf";
padding-right:3px;
}

#contents_hd #outline_area dl dd,
#contents_hd #outline_area p,
#contents_hd #outline_area ul li{
line-height:1.3em;
padding-bottom:0.2em;
}

#contents_hd #outline_area ul.caution li{
text-indent:-1em;
margin-left:1em;
}

#contents_hd #outline_area a{
	color:#00e;
	word-break: break-all;
}

/* #container.regist_confirm #contents #contents_hd p 確認画面テキスト
-------------------------------------------------- */
#container.regist_confirm #contents #contents_hd p{
font-weight:bold;
}



#contents_hd #outline_area ul.caution li.pl1 {
    padding-left: 1em;
}

#form_wrapper .box.mm_read > dl._err > dt, #form_wrapper .box > dl.mm_read._err > dt {
    color: #000;
}

#form_wrapper .box > dl._err > dt, #form_wrapper .box > dl.mm_read._err > dt, #form_wrapper #enquete dl._err dt em i {
    color: #000;
}



@media screen and (max-width:767px){
#contents_hd{
padding:0px 12px 20px 12px;
}

#contents #form_wrapper .btca_box h3 {
    color: #333;
}
}




/* =======================================================================
#contents #form_wrapper テーブル・フォーム周り関連スタイル
======================================================================= */
/* #form_wrapper h2.tit ■応募フォーム／■アンケート　等のタイトル部分
============================================================ */
#form_wrapper h2.tit{
color:#000;
margin-bottom:0.5em;
}

#form_wrapper h2.tit:before{
content:"\0025a0";
padding-right:3px;
}

/* #form_wrapper .box　テーブルの背景、線色
============================================================ */
#form_wrapper .box{
margin-bottom:2.2em;
background:#fff;
color:#444;
}

#form_wrapper .box > dl,
#form_wrapper .box > dl:last-child,
#form_wrapper .box > dl > dt,
#form_wrapper .box > dl > dd,
#form_wrapper .box.mm_read > dl > dt,
#form_wrapper .box > dl.mm_read > dt,
#form_wrapper .box > dl.mm_read > dt{
border-color:#d19a6e;
}

#form_wrapper .box > dl > dt,
#form_wrapper .box.mm_read > dl > dt,
#form_wrapper .box > dl.mm_read > dt{
background:#010101;
color: #ffffff;
}

#form_wrapper .box.mm_read > dl > dd.bg,
#form_wrapper .box > dl.mm_read > dd.bg{
background:#010101;
color: #ffffff;
}

@media screen and (max-width:767px){
#form_wrapper .box.mm_read > dl > dd.bg,
#form_wrapper .box > dl.mm_read > dd.bg{
background:#d19a6e;
}

#form_wrapper .box.mm_read > dl > dd.bg, #form_wrapper .box > dl.mm_read > dd.bg {
    color: #333;
}

}


/* #form_wrapper .box テーブル項目内の色関連
============================================================ */
#form_wrapper .box dl dd label.hover{background-color:#fffaaa;}

#form_wrapper .box dl dd ul.important{color:#06f;}

#form_wrapper .box dl.serial dd .serial_box{background:#efefef;}

#form_wrapper #enquete dl dt em i,
#form_wrapper #enquete dl dt em strong{
color:#fff;
}

#form_wrapper .box dl.mailmag dt span.to_sample a:before{background:#6cc;}
#form_wrapper .box dl.mailmag dt span.to_sample a:after{border-left:3px solid #fff;}
#form_wrapper .box dl.mailmag dd h3 {
    color: #333;
    background: none;
    padding-left: 0;
    line-height: normal;
}
#form_wrapper .box dl.mailmag dd .rihgt_txt p em{color:#f39;}
#form_wrapper .box dl.mailmag dd ul.caution li:last-child{color:#666;}


#form_wrapper .box > dl.mm_read dd ul.caution li.cl_wt {
    color: #fff;
}


@media screen and (max-width:767px){
#form_wrapper .box > dl.mm_read dd ul.caution li.cl_wt {
    color: #333;
}

}






/* #form_wrapper #submit_box フォームボタン
============================================================ */
#submit_box{padding-top:40px;}

#submit_box ul li a{
width:300px;
background:#ff7f04;
border:solid 1px #ff7f04;
box-shadow:2px 2px 2px #ffb76b inset,-1px -1px 1px #ff7c00 inset;
color:#fff;
}

#submit_box a.hover,
#submit_box a:active{
background-color:#ffa73d;
box-shadow:2px 2px 2px #ff7f04 inset,-1px -1px 1px #ffb76b inset;
}

@media screen and (max-width:767px){
#submit_box{padding-top:20px;}

#submit_box ul li a{
width:96%;
border:solid 1px #fff;
background:#ffb76b;
background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffb76b), color-stop(50%,#ffa73d), color-stop(51%,#ff7c00), color-stop(100%,#ff7f04));
background:-webkit-linear-gradient(top, #ffb76b 0%,#ffa73d 50%,#ff7c00 51%,#ff7f04 100%);
}

#submit_box ul li a.hover,
#submit_box ul li a:active{
background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff7f04), color-stop(50%,#ff7c00), color-stop(51%,#ffa73d), color-stop(100%,#ffb76b));
background:-webkit-linear-gradient(top, #ff7f04 0%,#ff7c00 50%,#ffa73d 51%,#ffb76b 100%);
}
}

/* #container.regist_confirm #contents #form_wrapper #submit_box フォームボタン（確認画面）
============================================================ */
#container.regist_confirm #form_wrapper #submit_box ul li.to_done a{margin-right:250px;}

#container.regist_confirm #form_wrapper #submit_box ul li.to_back a{
margin-top:8px;
width:140px;
background:#999;
border:solid 1px #999;
box-shadow:2px 2px 2px #ccc inset,-1px -1px 1px #666 inset;
}

#container.regist_confirm #form_wrapper #submit_box ul li.to_back a.hover,
#container.regist_confirm #form_wrapper #submit_box ul li.to_back a:active{
background-color:#666;
}

@media screen and (max-width:767px){
#container.regist_confirm #form_wrapper #submit_box ul li.to_done a,
#container.regist_confirm #form_wrapper #submit_box ul li.to_back a{
width:96%;
margin:4px auto;
}

#container.regist_confirm #form_wrapper #submit_box ul li.to_back a{
background:#aaa;
background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#aaa), color-stop(50%,#999), color-stop(51%,#666), color-stop(100%,#888));
background:-webkit-linear-gradient(top, #aaa 0%,#999 50%,#666 51%,#888 100%);
}

#container.regist_confirm #form_wrapper #submit_box ul li.to_back a.hover,
#container.regist_confirm #form_wrapper #submit_box ul li.to_back a:active{
background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#888), color-stop(50%,#666), color-stop(51%,#999), color-stop(100%,#aaa));
background:-webkit-linear-gradient(top, #888 0%,#666 50%,#999 51%,#aaa 100%);
}
}






/* =======================================================================
#contents .link_list 完了、期限切れ、エラーページのブランドトップ等へのテキストリンク部分
======================================================================= */
#contents .link_list{padding-top:20px;}

#contents .link_list ul li{margin-bottom:1.4em;}
#contents .link_list ul li a{color:#00e;}
#contents .link_list ul li a:before{border-left:8px solid #f62;}


/* =======================================================================
#contents #brand_bnr 完了画面 ブランドバナー部分
======================================================================= */
#contents #brand_bnr{padding-top:1em;}

#contents #brand_bnr ul{width:96%;}
#contents #brand_bnr ul li{width:24%;}
#contents #brand_bnr ul li dl dt img{
width:98%;
min-width:215px;
}

#contents #brand_bnr ul li dl dd{
margin:0.3em 0 0.8em 0;
font-size:0.78em;
}

#contents #brand_bnr ul li a{color:#00e;}

@media screen and (max-width:767px){
#contents #brand_bnr ul{width:60%;}
#contents #brand_bnr ul li,
#contents #brand_bnr ul li dl dt img{
width:100%;
}
}

/* =======================================================================
#contents #link_box_area 完了画面 背景ありのリンクエリア部分
======================================================================= */
#contents #link_box_area{
background:#fef8c9;
width:96%;
}

/* #contents #link_box_area ul.bnr_list バナーリンク部分
-------------------------------------------------- */
#contents #link_box_area ul.bnr_list li{padding-top:1em;}

/* #contents #link_box_area dl.txt_list テキストリンク部分
-------------------------------------------------- */
#contents #link_box_area dl.txt_list{
width:60%;
min-width:310px;
margin-top:5px;
}

#contents #link_box_area dl.txt_list dd ul li{
margin-bottom:10px;
}

#contents #link_box_area dl.txt_list dd ul li a{
padding:2px 0 6px 30px;
}

#contents #link_box_area dl.txt_list dd ul li a:link{color:#06c;}
#contents #link_box_area dl.txt_list dd ul li a:visited{color:#579ab9;}
#contents #link_box_area dl.txt_list dd ul li a.hover,
#contents #link_box_area dl.txt_list dd ul li a:active{
color:#0cf;
}

@media screen and (max-width:767px){
#contents #link_box_area{width:100%;}
#contents #link_box_area ul.bnr_list li img{width:90%;}
#contents #link_box_area dl.txt_list{width:88%;min-width:auto;}
}

#contents p.mt1 {
    margin: 1em 0;
}





li.prize_image img {
    max-width: 300px;
	width: 100%;
}

#enquete p.q5_text {
    padding-bottom: 5px;
}

#contents #form_wrapper .btca_box h3 {
    background: #010101;
    padding: .8em 0.3em;
    color: #FFF;
}


#contents_hd #outline_area span.required {
    display: inline-block;
    vertical-align: middle;
    background: #f00;
    border-radius: 3px;
    color: #fff;
    font-weight: bold;
    font-size: 0.8em;
    letter-spacing: 0.2px;
    line-height: 1.72em;
    padding: 0 4px 0 20px;
}

/* =============================================================================
他、背景色を変える際、色によっては変更したほうがよさそうな色部分
============================================================================= */
/* #contents .thanks_txt h2 完了、期限切れ、エラーページの見出し色
-------------------------------------------------- */
#contents .thanks_txt h2{color:#1A0504;}

/* 確認画面、完了、期限切れ、エラーページのテキスト色
-------------------------------------------------- */
#contents #form_wrapper .btca_box,
#contents .thanks_txt p.info,
#contents .type_msg p.lead{
color:#444;
}

#form_wrapper #enquete dl dt em i.mt1 {
    font-weight: normal;
    padding-top: 1em;
    display: inline-block;
}