@charset "UTF-8";

/*-----------------------------------------------------------
	html and subordinate selector
-----------------------------------------------------------*/
.st-headerSp-buttonText,
.st-globalNavAreaSp-menuTrigger-text{
  line-height: 1.5;
}
html{}

body{
	background: #f7f3e4;
	padding-bottom: 20px;
}

#wrap{
	background-color: #FFF;
	margin: 0 auto;
	text-align: left;
	width: 978px;
}


/* ========== headerArea ========== */
#headerArea{
	padding: 14px 0 0 24px;
	margin-bottom: 16px;
	height: 38px;
}


/* ========== mainVisual ========== */
#mainVisual h1 {
	margin-bottom: 10px;
	text-align: center;
}


/* ========== currencyNav ========== */
#currencyNav{
	margin: 0 auto;
	width: 905px;
}
#currencyNav li{
	background-position: 0 -150px;
	display: block;
	height: 50px;
	float: left;
	margin: 0 4px;
	text-indent: -9999px;
	width: 105px;
}
#currencyNav li a {
	display:block;
	height:50px;
	width: 105px;
}
#currencyNav li a:hover {
	background-position: 0 -50px;
}

#currencyNav #currency01,
#currencyNav #currency01_now,
#currencyNav #currency01 a {
    background-image: url(../img/currency_01.gif);
}

#currencyNav #currency02,
#currencyNav #currency02_now,
#currencyNav #currency02 a {
    background-image: url(../img/currency_02.gif);
}

#currencyNav #currency03,
#currencyNav #currency03_now,
#currencyNav #currency03 a {
    background-image: url(../img/currency_03.gif);
}

#currencyNav #currency04,
#currencyNav #currency04_now,
#currencyNav #currency04 a {
    background-image: url(../img/currency_04.gif);
}

#currencyNav #currency05,
#currencyNav #currency05_now,
#currencyNav #currency05 a {
    background-image: url(../img/currency_05.gif);
}

#currencyNav #currency06,
#currencyNav #currency06_now,
#currencyNav #currency06 a {
    background-image: url(../img/currency_06.gif);
}

#currencyNav #currency07,
#currencyNav #currency07_now,
#currencyNav #currency07 a {
    background-image: url(../img/currency_07.gif);
}

#currencyNav #currency08,
#currencyNav #currency08_now,
#currencyNav #currency08 a {
    background-image: url(../img/currency_08.gif);
}

#currencyNav #currency01_now,
#currencyNav #currency02_now,
#currencyNav #currency03_now,
#currencyNav #currency04_now,
#currencyNav #currency05_now,
#currencyNav #currency06_now,
#currencyNav #currency07_now,
#currencyNav #currency08_now {
	background-position: 0 -100px !important;
}


/* ========== subVisualArea ========== */
#subVisualArea {
	margin: 30px 0 21px;
}

#subVisualArea p {
	text-align: center;
}


/* ========== LinkBtnArea-full ========== */
#LinkBtnArea-full{
	background-color: #f2f2f2;
	border-top: 2px solid #d9d9d9;
	margin-bottom: 40px;
	padding: 31px 0 38px;
}

#LinkBtnArea-full ul{
	margin-left: 170px;
}

#LinkBtnArea-full ul li{
	float: left;
}

#LinkBtnArea-full ul li + li {
	margin-left: 20px;
}



/*-----------------------------------------------------------
	general components
-----------------------------------------------------------*/
/* ========== multi-column ========== */
#contentArea .multi-column .column {
	float: left;
}

#contentArea .multi-column .column + .column {
	margin-left: 20px;
}

/* ========== compact ========== */
#contentArea .compact li {
	display: inline;
}



/*-----------------------------------------------------------
	contentArea
-----------------------------------------------------------*/
#contentArea {
	line-height: 1.5;
}


/* ========== subVisual ========== */
#contentArea .subVisual {
	margin: 30px 40px;
}


/* ========== about-ZAR ========== */
#about-ZAR {
	background-color: #fff9e6;
	margin: 40px;
}

/* ----- block-01 ----- */
#about-ZAR .block-01 {
	background-color: #ffffff;
	margin: 5px 5px 20px;
	padding: 35px;
	position: relative;
}

#about-ZAR .block-01:after {
	background: url(../img/bg-image_02.gif) center bottom no-repeat;
	content: "";
	display: block;
	height: 20px;
	margin-left: -20px;
	position: absolute;
		bottom: -20px;
		left: 50%;
	width: 40px;
}

/* ----- block-02 ----- */
#about-ZAR .block-02 {
	padding: 15px 20px 20px;
}

#about-ZAR .block-02 h3 {
	margin: 35px 0 0 25px;
}

#about-ZAR .block-02 p.alignRight {
	margin-right: 25px;
}

#about-ZAR .block-rand-interest h3{
	color: #eb7000;
	font-size: 26px;
}

#about-ZAR .block-rand-interest h4{
	color: #eb7000;
	font-size: 16px;
	margin-top: 15px;
	margin-left: 20px;
}

#about-ZAR .block-rand-interest .p-r-15{
	padding-right: 15px;
}

.ui-selectable{
	margin: 10px auto;
	width: 270px;
}

.block-rand-interest table , td, th {
	border: 1px solid #FFD0A6;;
	border-collapse: collapse;
	text-align: center;
	font-size: 14px;
}
.block-rand-interest td, th {
	padding: 20px;
	width: 30px;
	height: 25px;
}

.block-rand-interest th {
background-color: rgba(239, 184, 10, 0.17);
}

.block-rand-interest td {
background-color: #fff;
}

.even {
	background: #fbf8f0;
}

.odd {
	background: #fefcf9;
}

#about-ZAR .rand-annotation{
	margin-top: 40px;
}
#about-ZAR .rand-annotation li:first-child{
	padding: 0;
}

#about-ZAR .rand-annotation li{
	margin-left: 1em;
	text-indent: -1em;
	padding-top: 5px;
}

/* ========== cancellation ========== */
#cancellation {
	background-color: #fff9e5;
	border-color: #f7f3e4;
	border-style: solid;
	border-width: 1px 0;
	margin: 40px 0 20px;
	padding: 40px;
}

#cancellation .area-title {
	margin-left: -40px;
}



/* ========== enquete ========== */
#enquete {
	margin-top: 20px;
}

#enquete .enquete-item-set + .enquete-item-set {
	border-top: #f7f3e4 solid 1px;
}

#enquete .enquete-item {
	margin: 30px 40px;
}

#enquete .enquete-item + .enquete-item {
	margin-top: 35px;
}

#enquete .enquete-item .item-title {
	margin-left: 3px;
}

/* ----- supplemental-info ----- */
#enquete .supplemental-info {
	background-color: #fff9e5;
	padding: 20px 40px;
}

#enquete .supplemental-info h5 {
	margin: 35px 0 0 -40px;
}

#enquete .supplemental-info p {
	margin-right: 20px;
	margin-left: 20px;
}

#enquete .supplemental-info p.alignCenter {
	margin-right: 0;
	margin-left: 0;
}

/* ----- remark-info ----- */
#enquete .remark-info {
	background-color: #f7f7f7;
	margin: 10px 45px;
	padding: 20px;
}

/* ========== ranking-01 ========== */
#contentArea .ranking-01 {
}

#contentArea .ranking-01 h2 {
	margin-left: -20px;
}

#contentArea .ranking-01 .ranking {
	margin: 30px -40px 0;
}

#contentArea .ranking-01 .ranking li {
	padding: 27px 0 27px 60px;
}

#contentArea .ranking-01 .ranking li.even {
	background-color: #f5f5f5;
}

#contentArea .ranking-01 .note {
	color: #666666;
	margin: 10px 0 0 35px;
}


/* ========== banner ========== */
#contentArea .banner{
	margin-bottom:30px;
}


/* ========== important ========== */
#contentArea .important{
	width: 800px;
	margin: 0 auto;
	border: 2px solid #D5003A;
}

#contentArea .important_image{
	padding: 30px 0 0 30px;
}

#contentArea .important .text{
	padding: 20px 30px 40px 30px;
	line-height: 1.5em;
}

#contentArea .important .text a:hover {
	color: #ff9922;
}

#contentArea .important .text p.jibun{
	text-align:right;
	padding-right: 5px;
}


/* ========== footer ========== */
#footerArea #copyright{
	margin: 20px 0 0;
	text-align: center;
}


/* ========== c-btnGroup-01 ========== */
.c-btnGroup-01{

}

/*-----------------------------------------------------------
	botton component
-----------------------------------------------------------*/

.c-btnGroup-01 a:before {
	width: 18px;
	height: 65%;
	background-image: url(/assets/img/marker_01_@2x.png);
	background-repeat: no-repeat;
	background-size: auto 18px;
	position: absolute;
	left: 12px;
	content: "";
}
.c-btnGroup-01 a:first-child{
	margin-left: 0;
}

.c-btnGroup-01 a {
	margin-top: 1.25em;
	margin-left: 20px;
	color: #535252;
	text-decoration: none;
	border-radius: 24px;
	padding: 12px 16px 10px 36px;
	display: inline-block;
	border: 1px solid #d4d5d5;
	position: relative;
	background: #fff;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…EiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,#fff 0,#f3f3f3 100%);
	background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#fff),color-stop(100%,#f3f3f3));
	background: -webkit-linear-gradient(top,#fff 0,#f3f3f3 100%);
	background: -o-linear-gradient(top,#fff 0,#f3f3f3 100%);
	background: -ms-linear-gradient(top,#fff 0,#f3f3f3 100%);
	background: linear-gradient(to bottom,#fff 0,#f3f3f3 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#f3f3f3',GradientType=0);
}
.c-btnGroup-01 a:hover{
	opacity: 0.8;
}

.btn {
	display: inline-block;
	padding: 6px 12px;
	margin-bottom: 0;
	font-size: 16px;
	font-weight: normal;
	line-height: 1.428571429;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	background-image: none;
	border: 1px solid transparent;
	border-radius: 4px;
	white-space: nowrap;
}


/*-----------------------------------------------------------
	set control
-----------------------------------------------------------*/
/* ========== clear fix ========== */
.float-area,
.multi-column,
#currencyNav,
#LinkBtnArea-full ul {
	_zoom: 1;
}

.float-area:after,
.multi-column:after,
#currencyNav:after,
#LinkBtnArea-full ul:after {
	clear: both;
	content: "";
	display: block;
}