.blog .top {
	background-image: url('../images/blog/top-1.jpg');
}



.blog .headline {
	padding-bottom: 56px;
	text-align: center;
	padding-top: 60px;
}

@media only screen and (max-width: 840px) {
	.blog .headline br {
		display: none;
	}
}



/*** blog list start ***/
#article {
	color: #404040;
}
#article .about {
	padding-bottom: 28px;
	padding-top: 32px;
}
#article .about .outer {
	padding-right: 50px;
	position: relative;
}
#article .about.show .outer {
	padding-right: 0;
}
#article .about .more {
	position: absolute;
	right: 0;
	top: 8px;
}
#article .about.show .more {
	display: none;
}
#article .about .more .icon {
	background: url('../images/blog/arrow-down-black.png') no-repeat center center;
	background-size: cover;
	height: 19px;
	width: 30px;
}
.csstransitions.page-loaded #article .about .more .icon {
	transition: background-image .4s ease-in-out;
}
#article .about .more:hover .icon {
	background-image: url('../images/blog/arrow-down-orange.png');
}
#article .about .more .text {
	text-decoration: underline;
	text-align: center;
	font-weight: 700;
	font-size: 12px;
}
#article .about .bold {
	font-weight: 700;
	font-size: 22px;
	line-height: 1;
}
#article .about .desc {
	max-height: 22px;
	overflow: hidden;
	margin-top: 6px;
}
html.no-js #article .about .desc {
	max-height: none;
}
#article .about.show .desc {
	max-height: none;
}
#article .about.less .desc {
	max-width: 756px;
}



.SlectBox {
	padding: 10px 18px 10px 15px;
	width: 100%;
}
.SumoSelect {
	text-align: left;
	font-weight: 300;
	font-size: 16px;
	cursor: pointer;
	width: 100%;
}
.SumoSelect > .CaptionCont {
	border-radius: 0;
	border: none;
}
.SumoSelect > .optWrapper {
	top: 90%;
}
.SumoSelect > .optWrapper.open {
	top: 100%;
	top: calc(100% - 1px);
}
.SumoSelect:focus > .CaptionCont,
.SumoSelect:hover > .CaptionCont {
	box-shadow: none;
}
.SumoSelect > .CaptionCont > span {
	text-overflow: clip;
	cursor: pointer;
}
.SumoSelect > .CaptionCont > label {
	width: 40px;
}
.SumoSelect > .CaptionCont > label > i {
	background: none;
}
.SumoSelect > .CaptionCont > label > i:before {
	border-color: #585b69 transparent transparent transparent;
	border-width: 9px 7px 0 7px;
	display: inline-block;
	border-style: solid;
	position: relative;
	content: ' ';
	height: 0;
	top: -3px;
	width: 0;
}
.SumoSelect > .optWrapper > .options > li {
	padding-right: 14px;
	padding-left: 14px;
}
.SumoSelect > .optWrapper > .options > li:first-child.selected {
	display: none;
}



#article.list .question .row {
	display: table;
}
#article.list .question .cell {
	vertical-align: top;
	white-space: normal;
	display: table-cell;
}
#article.list .question .cell:first-child {
	font-weight: 700;
	font-size: 26px;
	line-height: 1;
	color: #D53026;
}
#article.list .question .title {
	letter-spacing: -.5px;
	font-weight: 600;
	line-height: 1.3;
}
html:lang(ja) #article.list .question .title,
html:lang(zh) #article.list .question .title {
	letter-spacing: .4px;
}
#article.list .question .answer {
	font-size: 20px;
	line-height: 1;
}



#article.list .view {
	text-align: center;
	display: none;
	width: 100%;
}
#article.list .view .link {
	text-decoration: underline;
	text-transform: uppercase;
	display: inline-block;
	font-weight: 700;
	font-size: 12px;
	line-height: 1;
}



#article .highlight {
	background-color: #f6f7f2;
	padding-bottom: 38px;
	padding-top: 38px;
}
#article .highlight .bold {
	text-transform: uppercase;
	letter-spacing: -.5px;
	margin-bottom: 20px;
	font-weight: 700;
	font-size: 15px;
	line-height: 1;
	color: #D53026;
}
#article.list .highlight .question .title {
	padding-left: 10px;
	margin-top: -3px;
	font-size: 22px;
	display: block;
}
html:lang(ja) #article.list .highlight .question .title,
html:lang(zh) #article.list .highlight .question .title {
	font-size: 18px;
}
#article.list .highlight .question .row+.row {
	margin-top: 18px;
}
#article.list .highlight .question .answer {
	padding-left: 15px;
	padding-top: 3px;
	max-height: 24px;
}
html.no-js #article.list .highlight .question .answer {
	max-height: none;
}
html:lang(ja) #article.list .highlight .question .answer,
html:lang(zh) #article.list .highlight .question .answer {
	font-size: 16px;
}
#article.list .highlight .view .link {
	padding-top: 24px;
}



#article .control {
	padding-bottom: 60px;
	padding-top: 40px;
	display: table;
	width: 100%;
}



#topicFilter {
	vertical-align: top;
	padding-right: 40px;
	display: table-cell;
}
#topicFilter .text {
	letter-spacing: -.5px;
	vertical-align: top;
	display: table-cell;
	font-weight: 600;
	width: 122px;
}
#topicFilter .items {
	vertical-align: top;
	white-space: normal;
	display: table-cell;
	margin-top: -2px;
	font-size: 0;
}
#topicFilter .item {
	background-color: #8f929a;
	text-transform: uppercase;
	display: inline-block;
	margin-bottom: 5px;
	text-align: center;
	padding: 4px 14px;
	font-size: 12px;
	min-width: 68px;
	line-height: 1;
	color: white;
}
.csstransitions.page-loaded #topicFilter .item {
	transition: background-color .4s ease-in-out;
}
#topicFilter .item.on,
#topicFilter .item:hover {
	background-color: #2e3246;
}
#topicFilter .sp {
	display: inline-block;
	width: 5px;
}
#topicFilter select {
	display: none;
}
#topicFilter .SumoSelect {
	max-width: 240px;
	display: none;
}



#viewMode {
	vertical-align: top;
	padding-right: 10px;
	display: table-cell;
	text-align: right;
	width: 210px;
}
#viewMode .item {
	display: inline-block;
}
#content[viewmode="grid"] #viewMode .item[mode="grid"],
#content[viewmode="row"] #viewMode .item[mode="row"] {
	color: #D53026;
}
.csstransitions.page-loaded #viewMode .item .icon {
	transition: background-image .4s ease-in-out;
}
#viewMode .item+.item {
	margin-left: 22px;
}
#viewMode .item .icon {
	background: no-repeat center center;
	background-size: cover;
	vertical-align: middle;
	display: inline-block;
	height: 18px;
	width: 20px;
}
#viewMode .item[mode="grid"] .icon {
	background-image: url('../images/blog/icon-grid.png');
}
#content[viewmode="grid"] #viewMode .item[mode="grid"] .icon,
#viewMode .item[mode="grid"]:hover .icon {
	background-image: url('../images/blog/icon-grid-orange.png');
}
#viewMode .item[mode="row"] .icon {
	background-image: url('../images/blog/icon-row.png');
}
#content[viewmode="row"] #viewMode .item[mode="row"] .icon,
#viewMode .item[mode="row"]:hover .icon {
	background-image: url('../images/blog/icon-row-orange.png');
}
#viewMode .item .text {
	text-transform: uppercase;
	vertical-align: middle;
	display: inline-block;
	margin-left: 8px;
	font-weight: 700;
	margin-top: -1px;
	font-size: 14px;
	line-height: 1;
}



#list {
	position: relative;
}
#list .ref-item {
	display: inline-block;
	position: absolute;
	width: 50%;
}
#list .item {
	padding: 15px 10px 10px;
	display: inline-block;
	vertical-align: top;
	position: absolute;
	color: black;
	width: 100%;
}
html.no-js #list .item {
	position: relative;
}
#content[viewmode="row"] #list .item {
	position: relative;
}
.page-loaded #list .item {
	transition: left .4s ease-in-out, top .4s ease-in-out;
}
#list .outer {
	border: 1px solid #cecece;
	background-color: #FFF;
}
#content[viewmode="row"] #list .cover {
	display: none;
}
#list .cover img {
	vertical-align: top;
	width: 100%;
}
#list .text {
	padding: 56px 26px 30px 20px;
}
#list .cover+.text {
	padding-top: 20px;
}
#content[viewmode="row"] #list .text {
	padding-top: 27px;
}
#list .date {
	background-color: #FCB315;
	text-align: center;
	position: absolute;
	padding-top: 13px;
	height: 62px;
	color: #FFF;
	width: 62px;
	left: 0;
	top: 0;
}
#list .date .day {
	font-size: 26px;
	line-height: 1;
}
#list .date .month {
	text-transform: uppercase;
	font-weight: 800;
	font-size: 14px;
	line-height: 1;
}
#list .topic {
	padding-bottom: 14px;
	margin-left: -5px;
	font-size: 0;
}
#content[viewmode="row"] #list .topic {
	padding-left: 51px;
}
#list .topic div {
	background-color: #32374A;
	text-transform: uppercase;
	display: inline-block;
	margin-bottom: 4px;
	padding: 4px 12px;
	margin-left: 5px;
	font-weight: 600;
	font-size: 11px;
	cursor: pointer;
	line-height: 1;
	color: #FFF;
}
#content[viewmode="row"] #list .topic div {
	background-color: #8f929a;
}
.csstransitions.page-loaded #list .topic div {
	transition: background-color .4s ease-in-out;
}
#list .topic div:hover {
	background-color: #D53026;
}
#content[viewmode="row"] #list .topic div:hover {
	background-color: #2e3246;
}
#list .item .question .row+.row {
	margin-top: 12px;
}
#list .item .question .title {
	padding-left: 5px;
	line-height: 1.4;
	font-size: 20px;
	display: block;
}
html:lang(ja) #list .item .question .title,
html:lang(zh) #list .item .question .title {
	font-size: 18px;
}
#list .item .question .answer {
	padding-left: 6px;
	max-height: 116px;
	padding-top: 6px;
	line-height: 1.4;
	font-size: 16px;
	display: block;
}
#content[viewmode="row"] #list .item .question .answer {
	max-height: 72px;
}
#list .item .view {
	margin-top: 24px;
}
#content[viewmode="row"] #list .item .view {
	display: none;
}



#list .have-question {
	padding-top: 10px;
}
#list .have-question .outer {
	background: #FCB315; /* Old browsers */
	background: -moz-linear-gradient(top, #fbc552 0%, #FCB315 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbc552), color-stop(100%,#FCB315)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #fbc552 0%,#FCB315 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #fbc552 0%,#FCB315 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #fbc552 0%,#FCB315 100%); /* IE10+ */
	background: linear-gradient(to bottom, #fbc552 0%,#FCB315 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fbc552', endColorstr='#FCB315',GradientType=0 ); /* IE6-9 */
	padding: 32px 22px 26px;
	text-align: center;
	border-width: 0;
	color: white;
}
#list .have-question .title {
	font-weight: 900;
	font-size: 22px;
	line-height: 1;
}
#list .have-question .desc {
	padding-top: 16px;
	line-height: 1;
}
#list .have-question .view {
	margin-top: 20px;
}
#list .have-question .view,
#content[viewmode="row"] #list .have-question .view {
	display: block;
}
#list .have-question .view .link {
	background-color: #32374A;
	text-decoration: none;
	padding: 5px 16px 6px;
	border-radius: 5px;
	font-weight: 600;
	font-size: 14px;
	color: white;
}
.csstransitions.page-loaded #list .have-question .view .link {
	transition: background-color .4s ease-in-out;
}
#list .have-question .view .link:hover {
	background-color: #D53026;
}



#content .more {
	text-align: center;
	margin-top: 28px;
	display: block;
}
#content .more:after {
	border-color: #585b69 transparent transparent transparent;
	border-width: 9px 7px 0 7px;
	display: inline-block;
	border-style: solid;
	content: ' ';
	height: 0;
	width: 0;
}
.csstransitions.page-loaded #content .more:after {
	transition: border-top-color .4s ease-in-out;
}
#content .more:hover:after {
	border-top-color: #D53026;
}
#content .more .text {
	text-decoration: underline;
	text-transform: uppercase;
	letter-spacing: -.4px;
	font-weight: 700;
	font-size: 12px;
	line-height: 1;
}

@media (max-height: 768px) {
	#list .item .question .title {
		letter-spacing: 0;
		font-size: 18px;
	}
}
@media (max-width: 740px) {
	#topicFilter .text, #topicFilter .items {
		display: none;
	}
	#topicFilter .SumoSelect {
		display: inline-block;
	}

	#viewMode {
		vertical-align: middle;
	}

	#list .ref-item {
		width: 100%;
	}
}
@media (max-width: 480px) {
	#article .about .bold {
		font-size: 16px;
	}

	#viewMode .item .text {
		display: none;
	}
	#viewMode .item+.item {
		margin-left: 12px;
	}
	#viewMode {
		width: 70px;
	}

	#article.list .question .cell:first-child {
		font-size: 22px;
	}
	#article.list .question .title {
		letter-spacing: 0;
	}
	#article.list .highlight .question .title {
		line-height: 1.2;
		font-size: 16px;
	}
	#article.list .highlight .question .answer {
		line-height: 1.4;
		max-height: 60px;
		font-size: 14px;
	}
	#list .date {
		left: -10px;
	}
	#list .item {
		padding-top: 10px;
		padding-right: 0;
		padding-left: 0;
	}
	#list .text {
		padding-right: 20px;
		padding-top: 76px;
	}
	#list .item .question .title {
		font-size: 16px;
	}
	#list .item .question .answer {
		font-size: 14px;
	}
}
/*** blog list end ***/