@charset "UTF-8";
/* CSS Document */

/*
CSS for Builds ver.01.01
*/

/*
01 Base
========================================================================== */
/*===== Whole =====*/
.builds-content { width: 850px; padding: 5em 0 7.5em; margin: auto; }
.builds-content > div {}
.builds-content > div > div {}
.builds-content > div + div { margin: 2.25em 0 0 0; }
.builds-content > div > hr { margin: 2.5em 0; }
.builds-content div p { font-size: 13px; line-height: 1.9; }
.builds-content div img { width: 100%; max-width: 100%; }

div.backlist { margin: 1.5em 0 0 0; }
div.backlist a {
	display: inline-block;
	padding: 0 0 0 2em;
	font-size: 13px;
	letter-spacing: .03rem;
	position: relative;
}
div.backlist a:before {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 3px 6px 3px 0;
	border-color: transparent rgba(55,55,55,1) transparent transparent;
	position: absolute;
	top: 1px;
	left: 0;
}

/*
02 Type
========================================================================== */
.builds-content .typeLying {}
.builds-content .typeSplit {
	align-items: center;
	justify-content: space-between;
}
.builds-content .typeSplit p {}
.builds-content .typeSplit div { width: 47.5%; }

/*
03 Option
========================================================================== */
/*=== Style ===*/
/*Title*/
.builds-content .styleTitle {}
.builds-content .styleTitle h2 { font-size: 15px; font-weight: 600; letter-spacing: .02rem; }
.builds-content .styleTitle.verOrange { color: rgba(239,90,35,1); }
.builds-content .styleTitle.verBlue { color: rgba(54,127,198,1); }

/*Img*/
.builds-content .styleImages { padding: .75em 0; display: flex; justify-content: space-between }
.builds-content .styleImages > div > * { width: 100%; }
.builds-content .styleImages.column1 > div { width: 100%; }
.builds-content .styleImages.column2 > div { width: 49%; }
/*Text*/
.builds-content .styleText { flex-direction: column; }
/*Line*/
.builds-content .styleLine {}
.builds-content .styleLine hr {
	display: block;
	width: 100%;
	height: 1px;
	background-color: rgba(220,215,200,1);
}
_:-ms-fullscreen, :root .builds-content div.styleLine hr {
	background-size: 600px 25px;
}

/*Link*/
.builds-content .styleLink a {
	display: inline-block;
	margin: 1.25em 0;
}
.builds-content .styleLink a i {
	display: block;
	padding: .75em 3.5em .75em 3em;
	border-radius: .35em;
	color: rgba(255,255,255,1);
	background-color: rgba(75,75,75,1);
	font-size: 12px;
	letter-spacing: 0;
	position: relative;
	transition: .2s ease;
}
.builds-content .styleLink a i:before {
	content: "";
	width: 4px;
	height: 4px;
	border-top: 1px solid rgba(255,255,255,1);
	border-right: 1px solid rgba(255,255,255,1);
	position: absolute;
	top: 50%;
	right: 1.5em;
	transform: translate(0,-50%) rotate(45deg);
}
.builds-content > .styleLink + .styleLink  { margin: 0 0 0 0; }

/*
04 Custom by Themes
========================================================================== */
/*===== Layout =====*/
/*Common*/
.builds-content .styleImageTitleText {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.builds-content .styleImageTitleText.verRight { flex-direction: row-reverse; }
.builds-content .styleImageTitleText > div { width: 49%; }
.builds-content .styleImageTitleText h2 { margin: 0 0 1em 0; font-size: 14px; font-weight: 600; letter-spacing: .02rem; }
.builds-content .styleImageTitleText.verOrange h2 { color: rgba(239,90,35,1); }
.builds-content .styleImageTitleText.verBlue h2 { color: rgba(54,127,198,1); }
.builds-content .styleImageTitleText.verRight div + div { padding: 0 2em 0 0; }
.builds-content .styleImageTitleText.verLeft div + div { padding: 0 0 0 2em; }

@media (max-width: 1096px) {

/*
01 Base
========================================================================== */
/*===== Whole =====*/

/*
02 Type
========================================================================== */

/*
03 Option
========================================================================== */
/*=== Style ===*/

}

@media (max-width: 1024px) {

/*
01 Base
========================================================================== */
/*===== Whole =====*/
.builds-content { width: initial; padding: 5em 7.5em 7.5em; }

/*
02 Type
========================================================================== */

/*
03 Option
========================================================================== */
/*=== Style ===*/

}

@media (max-width: 840px) {

/*
01 Base
========================================================================== */
/*===== Whole =====*/
.builds-content { padding: 5em 5em 7.5em; }
.builds-content > div { flex-direction: column; }
.builds-content > div + div { margin: 1.5em 0 0 0; }
.builds-content div p { padding: 0 0 .75em 0; }

/*
02 Type
========================================================================== */
.builds-content .typeSplit div { width: 100%; padding: 0 0 0 0; }
.builds-content .typeSplit div + div { padding: 1.5em 0 0 0; }
.builds-content .typeSplit div img { padding: .5em 0; }

.builds-content .styleImageTitleText h2 { margin: 2em 0 1.5em 0; font-size: 13px; }
.builds-content .styleImageTitleText.verRight div + div { padding: 0 0 0 0; }
.builds-content .styleImageTitleText.verLeft div + div { padding: 0 0 0 0; }

/*
03 Option
========================================================================== */
/*=== Style ===*/
.builds-content .styleLine hr {}

.builds-content .styleTitle h2 { margin: 0 0 1.5em 0; font-size: 14px; }

.builds-content .styleImages.column2 { flex-direction: column; }
.builds-content .styleImages.column2 > div { width: 100%; }
.builds-content .styleImages.column2 > div + div { margin: 1.5em 0 0 0; }

/*
04 Custom by Themes
========================================================================== */
/*===== Layout =====*/
/*Common*/
.builds-content .styleImageTitleText {}
.builds-content .styleImageTitleText.verLeft,
.builds-content .styleImageTitleText.verRight { flex-direction: column; }
.builds-content .styleImageTitleText > div { width: 100%; }
.builds-content .styleImageTitleText > div + div { margin: 0 0 1.5em 0; }
.builds-content .styleImageTitleText.verLeft > div + div { margin: 0 0 1.5em 0; }

}

@media (max-width: 600px) {

/*
01 Base
========================================================================== */
/*===== Whole =====*/
.builds-content { padding: 5em 2.25em 7.5em; }


/*
02 Type
========================================================================== */
.builds-content div p {}

/*
03 Option
========================================================================== */
/*=== Style ===*/
/*Tit;e*/
.builds-content .styleTitle h3 { font-size: 14px; }
/*Line*/
.builds-content .styleLine {}
.builds-content .styleLine hr {}

}