@charset "Shift_JIS";

/* =======================================================================
#suntory_contents 背景色
======================================================================= */
#suntory_contents{background:#fff;}


/* =======================================================================
#suntory_contents #container 横幅、メイン画像
======================================================================= */
/* =======================================================================
#contents #contents_hd メイン画像下 応募要項等 フリーカスタムエリア
======================================================================= */
#contents_hd p.subttl {
text-align: center;
color: #bb0e50;
font-weight: bold;
margin-bottom: 1em;
font-size: 140%;
line-height: 140%;
}

#container p.minor_caution_blue {
    text-align: center;
    color: #cc0000;
    font-weight: bold;
    margin-bottom: 1em;
	font-size: 140%;
}


/* #contents_hd #outline_area
============================================================ */
#contents_hd #outline_area h2,
#contents_hd #outline_area dl dt{
color:#0079c2;
}

#outline_area ul li.pl1 {
padding-left: 1em;
}

#contents_hd #outline_area a{color:#00e;}

#contents_hd p.mt1, 
#contents_hd ul li.mt1 {
margin-top: 1em;
}


@media screen and (max-width:767px){
#form_wrapper h2.tit {
margin-left: 0;
margin-bottom: 0;
}
}

/* #container.regist_confirm #contents #contents_hd p 確認画面テキスト
-------------------------------------------------- */
@media screen and (max-width:767px){
#contents_hd{
padding:0px 12px 20px 12px;
}
}


/*
#contents #form_wrapper #twitter.box( ACCOUNT )
======================================================================= */
#form_wrapper .box#twitter dd ul li input[type="radio"] {
width: auto;
}

#form_wrapper #twitter ul.inline li {
display: inline;
padding: 0 10px 0 0;
}

#form_wrapper .box .red {
margin-top: 2px;
}

#twitter dl.pr40 dt {
padding-right: 40px;
}

#form_wrapper #twitter.box ._err_err ul.txt {
margin-top: 0;
}

#form_wrapper .box > dl._err_err > dt {
background-color: #f9c;
width:248px;
}

#form_wrapper .box > dl._err_err > dd {
    background-color: #fff7ff;
}

#form_wrapper .box ._err_err {
border: 2px solid #f00 !important;
}

@media screen and (max-width:767px){
#form_wrapper #twitter ul.inline li {
padding: 0;
}

#form_wrapper .box#twitter dd ul li input {
width: 89%;
}

#twitter dl.pr40 dt {
padding-right: 6px;
}

}


/* #form_wrapper h2.tit ■応募フォーム／■アンケート　タイトル帯
============================================================ */
#form_wrapper h2.tit{
color:#FFF;
background-color: #0079c2;
padding: 10px 5px;
}

/* #form_wrapper h2.tit ◆応募フォーム／◆アンケート　
============================================================ */
#form_wrapper h2.tit:before{
content:"\0025cf";
}
/* #form_wrapper .box　テーブルの背景、線色
============================================================ */
#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:#0079c2;
}

#form_wrapper .box > dl > dt,
#form_wrapper .box.mm_read > dl > dt,
#form_wrapper .box > dl.mm_read > dt{
background:#cfe8ff;
}

#form_wrapper .box.mm_read > dl > dd.bg,
#form_wrapper .box > dl.mm_read > dd.bg{
background:#cfe8ff;
}

@media screen and (max-width:767px){
#form_wrapper .box.mm_read > dl > dd.bg, #form_wrapper .box > dl.mm_read > dd.bg {
background: #c0e1ff;
}
}

/* #form_wrapper .box テーブル項目内の色関連
============================================================ */
#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:#000;
}

#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:#f39;}
#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;}

/*
#contents #form_wrapper テーブル・フォーム周り関連スタイル
======================================================================= */
/* 入力フォーム 選択肢のインライン対応 */
#form_wrapper #enquete ul.inline {
  display: inline-flex;
}
#form_wrapper #enquete ul.inline li:not(:last-child) {
  padding-right: 10px;
}

@media screen and (max-width:767px){
	/* 入力フォーム 選択肢のインライン解除 */
  #form_wrapper #enquete ul.inline {
    display: block;
  }
  #form_wrapper #enquete ul.inline li {
  	padding-right: 0;
  }
}


/* #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.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 ul li a{color:#00e;}
#contents .link_list ul li a:before{border-left:8px solid #f62;}
*/
/* =======================================================================
#contents .link_list 完了画面 #thanks_txt
======================================================================= */

#contents .thanks_txt p.info.mt1 {
margin-top: 1em;
}

#contents div#inquiry {
text-align: center;
margin-top: 2em;
font-size: 90%;
color: #0079c2;
}

#contents .thanks_txt p.info {
    text-align: left;
    width: 750px;
    margin: 0 auto;
}

@media screen and (max-width:767px){
.thanks_txt {
padding: 0 1em;
}

#contents #form_wrapper .btca_box, 
#contents .thanks_txt p.info, 
#contents .type_msg p.lead {
text-align: left;
width: auto;
}

#contents div#inquiry {
text-align: left;
}

}
/* =======================================================================
#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 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 .thanks_txt h2 完了、期限切れ、エラーページの見出し色
-------------------------------------------------- */
#contents .thanks_txt h2{color:#0079c2;}

/* 確認画面、完了、期限切れ、エラーページのテキスト色
-------------------------------------------------- */
#contents #form_wrapper .btca_box,
#contents .thanks_txt p.info,
#contents .type_msg p.lead{
color:#444;
}


#form_wrapper .box dl.email dd p.er_msg_point {
margin-bottom: 0;
}

#form_wrapper .box dl.email dd p.er_msg_point span {
display: block;
margin-bottom: 0.5em;
}

