@charset "utf-8";
/*--------------------
sg Common 
--------------------*/
body {
color: #000;
font-size: 18px;
font-family: "Yu Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif"
}
.rollAlpha:hover {
opacity: .6;
}
input[type='text'],
input[type='password'],
textarea,
table select {
border-color: #c9c5aa;
font-size: 16px;
font-family: "Yu Gothic";
padding:5px;
}
input[type='text'],
input[type='password'],
textarea {
padding: 6px 10px;
}
input:placeholder-shown {
color: #9d9d9d;
}
input::-webkit-input-placeholder {
color: #9d9d9d;
}
input:-ms-input-placeholder {
color: #9d9d9d;
}

/* ボタン */
.sgBtn {
background: #000;
border-radius: 4px;
font-size: 16px;
font-weight: bold;
display: inline-block;
line-height: 53px;
position: relative;
text-align: center;
width: 100%;
height: 50px;
}
.sgBtn a {
box-sizing: border-box;
display: inline-block;
padding-left: 20px;
width: 100%;
}
.sgBtn a:link,
.sgBtn a:visited {
color: #fff;
text-decoration: none;
}
.sgBtn img {
position: absolute;
left: 20px;
top: 30%;
}
.sgBtn.sgBtnR a {
padding-right: 20px;
}
.sgBtn.sgBtnR img {
left: inherit;
right: 20px;
}
.sgBtnYl {
background: #fdd000;
}
.sgBtn.sgBtnYl a:link,
.sgBtn.sgBtnYl a:visited {
color: #000;
text-decoration: none;
}
.sgBtnRd {
background: #cf2d04;
}
.sgBtnGry {
background: #dcdcdc;
}
.sgBtn.sgBtnGry a:link,
.sgBtn.sgBtnGry a:visited {
color: #000;
text-decoration: none;
}
.sgBtnGrn {
background: #77b800;
}


/*select装飾*/
.sgSelectDeco {
position: relative;
display: inline-block;
width: 300px;
vertical-align: middle;
}
.sgSelectDeco:before {
content: "";
position: absolute;
top: 50%;
right: 10px;
display: block;
width: 0;
height: 0;
margin: -6px 0 0 0;
border: 5px solid transparent;
border-top: 7px solid #666;
z-index: 10;
}
.sgSelectDeco select {
cursor: pointer;
position: relative;
-webkit-appearance: none;
appearance: none;
display: block;
width: 300px;
padding: 0.5em 1em;
background: #fff;
}
::-ms-expand {
display: none;
}
.sgSelectDecoShort {
width: 100px;
vertical-align: middle;
}
.sgSelectDecoShort select {
width: 100px;
}

/* checkbox,radio装飾 */
/*.sgCont input[type="checkbox"].sgInpStyle {
display: none;
}
.sgCont label.sgInpStyleChk {
position: relative;
display: inline-block;
padding: 3px 3px 3px 22px;
cursor: pointer;
}
.sgCont label.sgInpStyleChk::before {
position: absolute;
content: '';
top: 50%;
left: 0;
width: 14px;
height: 14px;
margin-top: -7.5px;
background: #fff;
border: 1px solid #c9c5aa;
}
.sgCont input[type="checkbox"].sgInpStyle:checked + label.sgInpStyleChk::after {
position: absolute;
content: '';
top: 6.5px;
left: 3px;
width: 13px;
height: 5px;
border-left: 3px solid #000;
border-bottom: 3px solid #000;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
} 

.sgCont input[type="radio"].sgInpStyle {
display: none;
}
.sgCont label.sgInpStyleRd {
position: relative;
display: inline-block;
padding: 3px 3px 3px 20px;
cursor: pointer;
}
.sgCont label.sgInpStyleRd::before {
position: absolute;
content: '';
top: 50%;
left: 0;
width: 14px;
height: 14px;
margin-top: -8px;
background: #c9c5aa;
border: 1px solid #898989;
border-radius: 100%;
}
.sgCont label.sgInpStyleRd::after {
position: absolute;
content: '';
top: 50%;
left: 0;
width: 9px;
height: 9px;
margin-top: -8px;
background: #f6f6f4;
border: 4px solid #000;
border-radius: 100%;
}
.sgCont .sgInpStyleCtr input[type="radio"].sgInpStyle {
display: inline-block;
}*/



/* ツールチップ */
#tiptip_content {
font-size: 12px;
color: #000;
text-shadow: none; 
padding: 10px;
border: none;
background: #FDEEAB;
border-radius: 0;
box-shadow: none;
}
#tiptip_holder.tip_top #tiptip_arrow {
	border-top-color: #FDEEAB;
}

#tiptip_holder.tip_bottom #tiptip_arrow {
	border-bottom-color: #FDEEAB;
}

#tiptip_holder.tip_right #tiptip_arrow {
	border-right-color: #FDEEAB;
}

#tiptip_holder.tip_left #tiptip_arrow {
	border-left-color: #FDEEAB;
}

#tiptip_holder.tip_top #tiptip_arrow_inner {
	margin-top: -7px;
	margin-left: -6px;
	border-top: 5px solid #FDEEAB;
}
#tiptip_holder.tip_bottom #tiptip_arrow_inner {
	margin-top: -5px;
	margin-left: -6px;
	border-bottom: 5px solid #FDEEAB;
}

#tiptip_holder.tip_right #tiptip_arrow_inner {
	margin-top: -6px;
	margin-left: -5px;
	border-right: 5px solid #FDEEAB;
}

#tiptip_holder.tip_left #tiptip_arrow_inner {
	margin-top: -6px;
	margin-left: -7px;
	border-left: 5px solid #FDEEAB;
}


table {
border-color: #c9c5aa;
margin: 0;
}
table tr {
border-color: #c9c5aa;
vertical-align: top;
}
table th {
background-color: inherit;
border-color: #c9c5aa;
padding: 20px;
}
table th .sgRegTableCaution {
font-size: 90%;
}
table td {
border-color: #c9c5aa;
padding: 20px;
}
.sgCont #undercolumn {
width: 1030px;
}

/* 打消し */
h2.title {
padding: 0;
border-top: none;
background-color: inherit;
}
h2.sgTit {
background: url(../img/sg_cart/tit_brd.png) no-repeat center left;
color: #000;
font-size: 22px;
font-weight: bold;
padding-left: 47px;
margin-bottom: 50px;
}

a:link {
color: #000;
text-decoration: underline;
}
a:link:hover, a[href]:hover {
text-decoration: none;
}

.sg3columCont {
width: 730px;
}
.sgPankuzu {
font-size: 14px;
margin-bottom: 50px;
}
.sgPankuzu li {
display: inline-block;
}

.sgSampleMore {
border-top: 1px solid #dcdad0;
padding-top: 20px;
margin-top: 30px;
text-align: center;
}
.sgSampleMore li {
text-align: center;
}

/*カレンダーUI*/
.sgCont .datepicker .ui-widget {
box-sizing: border-box;
font-family: inherit;
font-size: inherit;
width: 285px;
}
.sgCont .datepicker div {
margin-top: 0!important;
}
 .sgCont .datepicker .ui-datepicker .ui-datepicker-title {
margin: 0 2.3em;
line-height: 1.8em;
text-align: center;
font-size: 17px;
}
.sgCont .datepicker .ui-corner-all,
.sgCont .datepicker .ui-corner-bottom,
.sgCont .datepicker .ui-corner-right,
.sgCont .datepicker .ui-corner-br {
border-radius: 0;
}
 .sgCont .datepicker .ui-widget-content {
border: 2px solid #c0bfbb;
background: #fff;
color: #000;
}
.sgCont .datepicker .ui-datepicker-title span {
color: #000;
}
.sgCont .datepicker .ui-datepicker {
padding: 0;
}
.sgCont .datepicker .ui-datepicker table {
border: none;
}
.sgCont .datepicker .ui-datepicker-calendar {
font-size: 11px;
}
.sgCont .datepicker .ui-widget-header {
border: none;
border-bottom: 2px solid #c0bfbb;
background: #f0efea;
color: #000;
font-weight: bold;
padding: 0.5em 0;
}
.sgCont .datepicker .ui-datepicker .ui-datepicker-prev,
.sgCont .datepicker .ui-datepicker .ui-datepicker-next {
top: 8px;
}
.sgCont .datepicker .ui-widget-header .ui-icon.ui-icon-circle-triangle-w {
background: url(../img/sg_teiki/datepicker_left.png) no-repeat;
width: 8px;
height: 14px;
}
.sgCont .datepicker .ui-widget-header .ui-icon.ui-icon-circle-triangle-e {
background: url(../img/sg_teiki/datepicker_right.png) no-repeat;
width: 8px;
height: 14px;
}
.sgCont .datepicker .ui-state-default,
.sgCont .datepicker .ui-widget-content .ui-state-default,
.sgCont .datepicker .ui-widget-header .ui-state-default {
border: none;
background: #fff;
font-weight: bold;
color: #000;
}
.sgCont .datepicker .ui-datepicker td span,
.sgCont .datepicker .ui-datepicker td a {
display: block;
padding: 0.8em;
text-align: right;
text-decoration: none;
}
.sgCont .datepicker .ui-datepicker td span,
.sgCont .datepicker .ui-datepicker td a {
box-sizing: border-box;
display: block;
text-align: center;
text-decoration: none;
width: 33px;
height: 33px;
}
.sgCont .datepicker .ui-state-disabled,
.sgCont .datepicker .ui-widget-content .ui-state-disabled,
.sgCont .datepicker .ui-widget-header .ui-state-disabled {
opacity: 0.2;
background-image: none;
}
.sgCont .datepicker .ui-state-active,
.sgCont .datepicker .ui-widget-content .ui-state-active,
.sgCont .datepicker .ui-widget-header .ui-state-active {
background: #fdd000;
border-radius: 100%;
}