/* CSS Document */
/* slick
--------------------------------------- */
.slick-dotted.slick-slider {
margin-bottom: 0;
padding-bottom: 30px;
}

.slick-dots {
bottom: 0;
}

.slick-prev, .slick-next {
height: 30px;
}

.slick-prev:before, .slick-next:before {
border-bottom: 2px solid #4b4b4b;
content: "";
height: 20px;
width: 20px;
position: absolute;
top: 4px;
background: none;
}

.slick-next:before {
border-right: 2px solid #4b4b4b;
transform: rotate(-45deg);
right: 4px;
}

.slick-prev:before {
border-left: 2px solid #4b4b4b;
transform: rotate(45deg);
left: 4px;
}

.subBox .slick-prev:before , .subBox .slick-next:before {
border-color: #FFF!important;
}

.slick-dots li button:before {
background: #fff;
}

.slick-prev, .slick-next {
z-index: 100;
}

.subBox .slick-prev {
left: 20px;
}

.subBox .slick-next {
right: 20px;
}

h3 span,
h2 span {
display: block;
font-size: 16px;
}

/* btn
--------------------------------------- */
.btnBox {
text-align: center;
}

.btnBox a:not(:nth-child(2n)) {
margin-right: 17px;
}

.btn {
background: #ede4dd;
display: block;
font-size: 1.4rem;
line-height: 1.6;
margin: 0 auto;
padding: 8px 0;
text-align: center;
width: 260px;
position: relative;
}

.btn:before {
content: "";
display: block;
width: 8px;
height: 8px;
position: absolute;
margin: auto 0;
top: 0;
right: 10px;
bottom: 0;
border-right: #4b4b4b 2px solid;
border-top: #4b4b4b 2px solid;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}

/* mainBox
--------------------------------------- */
.mainBox .mainTitleBox {
position: relative;
}

.mainBox .mainTitleBox .mainTitle {
width: 100%;
color: #fff;
font-size: 36px;
font-weight: normal;
line-height: 1;
text-shadow: 0 0 20px rgba(0, 0, 0, 0.5),
0 0 20px rgba(0, 0, 0, 0.5);
text-align: center;
position: absolute;
left: 0;
top: 22%;
}

.mainBox .mainTitleBox .mainTitle span {
color: #fff;
display: block;
font-family: Lato, "Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 14px;
margin-top: 5px;
line-height: 1;
}

.mainBox h2 {
font-size: 24px;
margin: 25px 0 20px;
text-align: center;
}

.mainBox .dataBox {
margin: 20px 80px;
}

/* localNav
--------------------------------------- */
#localNav {
margin: 30px auto 40px;
max-width: 840px;
}

#localNav li {
border-bottom: 1px dotted #4b4b4b;
float: left;
width: 49%;
text-align: center;
}

#localNav li:nth-child(-n+2) {
border-top: 1px dotted #4b4b4b;
}

#localNav li:nth-child(2n) {
float: right;
}

#localNav li a {
display: block;
padding: 8px 0;
position: relative;
}

#localNav li a:before {
border-bottom: 1px solid #4b4b4b;
border-left: 1px solid #4b4b4b;
content: "";
height: 13px;
width: 13px;
position: absolute;
right: 15px;
top: 8px;
transform: rotate(-45deg);
}

#localNav li:nth-child(2n) a:before {
right: 15px;
}

/* subBox
--------------------------------------- */
.subBox {
background: #122745;
background-size: 100%;
margin: 0 0 40px;
padding: 0 0 40px;
}

.subBox01 .subBoxInnerSp {
background: url(../../images/diamond/cla_terra/img02.jpg) no-repeat 0 0;
background-size: 100%;
}

.subBox02 .subBoxInnerSp {
background: url(../../images/diamond/cla_terra/img05.jpg) no-repeat 0 0;
background-size: 100%;
}

.subBoxInner {
margin: 0 30px;
min-height: 480px;
}

.subBoxInner .innerTop,
.subBoxInner .innerBtm {
overflow: hidden;
zoom: 1;
}

.subBoxInner .innerTop .midTitle {
width: 50%;
padding: 90px 0 0;
text-align: center;
color: #fff;
float: left;
font-size: 20px;
font-size: 2.0rem;
line-height: 1.5;
}

.subBoxInner .innerTop .read {
width: 47%;
padding: 90px 0 0;
margin-bottom: 0;
text-align: center;
line-height: 1.8;
color: #fff;
float: right;
font-size: 16px;
font-size: 1.6rem;
}

.subBoxInner .innerBtm .sliderBox {
width: 50%;
padding: 0 0 30px;
text-align: center;
color: #fff;
float: left;
position: relative;
}

.subBoxInner .innerBtm .sliderBox .mainTitle {
margin: -30px 0 0;
color: #fff;
}

.subBoxInner .innerBtm .sliderBox .zoom {
position: absolute;
bottom: 100px;
right: 40px;
}

.subBoxInner .innerBtm .txt {
width: 47%;
margin: 20px 0 0;
color: #fff;
text-align: left;
float: right;
}

.subBox .moreBtn {
background: none;
border: 1px solid #fff;
display: block;
font-size: 1.4rem;
line-height: 1.6;
color: #fff;
margin: 0 auto 30px;
padding: 8px 0;
text-align: center;
width: 260px;
position: relative;
}

.subBox .moreBtn:before,
.subBox .moreBtn:after {
content: "";
display: block;
width: 8px;
height: 8px;
background: #ffffff;
position: absolute;
margin: auto 0;
top: 0;
right: 10px;
bottom: 0;
}

.subBox .moreBtn:before {
top: 50%;
right: 10px;
width: 12px;
height: 2px;
margin-top: -1px;
}

.subBox .moreBtn:after {
top: 50%;
right: 15px;
width: 2px;
height: 12px;
margin-top: -6px;
}

.subBox .moreBtn.act:after {
display: none;
}

.subBox .anc {
display: none;
}

.subBox .ancInner {
background: rgba(255, 255, 255, 0.1);
background-size: 100%;
margin: 0 30px;
padding: 30px;
}

.subBox .ancInner .txtBox {
overflow: hidden;
zoom: 1;
}

.subBox .ancInner .txtBox p {
color: #fff;
}

.subBox .ancInner .txtBox .innerImage {
float: left;
width: 37%;
margin: 0 20px 0 0;
text-align: center;
color: #fff;
}

.subBox .ancInner .txtBox .innerImage span {
margin: 20px 0 0;
}

.subBox .itemInner a {
color: #fff;
text-decoration: underline;
}

.subBox .itemInner a:hover {
text-decoration: none;
}

.subBox .itemInner p {
color: #fff;
}

.subBox .itemInner h3 {
font-size: 24px;
font-weight: normal;
color: #fff;
margin: 60px 0 20px;
text-align: center;
}

.subBox ul.list {
margin: 0 30px;
}

.subBox ul.list h4 {
font-size: 18px;
font-weight: bold;
color: #fff;
margin: 20px 0 18px;
}

.subBox ul.list h4 span {
font-size: 14px;
}

.subBox ul.list li {
float: left;
width: 49%;
margin-right: 2%;
}

.subBox ul.list li p {
margin: 0 10px;
word-break: break-all;
}

.subBox ul.list li:nth-child(2) {
margin-right: 0;
}

/*sampleBox,reportBox
--------------------------------------- */
.sampleBox h2, .reportBox h2 {
font-size: 24px;
font-weight: normal;
margin: 60px 0 20px;
text-align: center;
line-height: 1.5;
}

.sampleBox, .reportBox, .historyBox {
margin: 60px 0 100px;
}

.sampleBox ul.list {
margin: 0 0 30px;
}

/* .sampleBox ul.list li {
float: left;
width: 49%;
margin-right: 2%;
} */

.sampleBox ul.list li p {
margin: 10px 0;
}
.sampleBox ul.list .slick-slide {
padding: 0 10px;
}

/* .sampleBox ul.list li:nth-child(2) {
margin-right: 0;
} */

.reportBox .imgBox {
text-align: center;
margin: 0 0 20px;
}

.reportBox .imgBox img {
max-width: 620px;
}

.sampleBox .linklist {
text-align: center;
}

.sampleBox .linklist li {
display: inline-block;
font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
color: #4b4b4b;
background: #e6d9d0;
text-align: center;
margin: 0 10px 16px;
width: 260px;
font-size: 1.4rem;
}

.sampleBox .linklist li a {
display: block;
padding: 8px 0;
position: relative;
}

.sampleBox .linklist li a:before {
content: "";
display: block;
width: 8px;
height: 8px;
position: absolute;
margin: auto 0;
top: 0;
right: 10px;
bottom: 0;
border-right: #4b4b4b 2px solid;
border-top: #4b4b4b 2px solid;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}

.reportBox .text {
max-width: 840px;
margin: 0 auto;
}

.historyBox .historyBoxInner {
border: 2px solid #7f7f7f;
padding: 28px 18px 28px 28px;
}

.historyBox .historyBoxInner .imgBox {
float: left;
text-align: center;
width: 45%;
}

.historyBox .historyBoxInner h2 {
font-size: 20px;
text-align: left;
}

.historyBox .historyBoxInner h2,
.historyBox .historyBoxInner .text {
float: right;
width: 52.5%;
}

.historyBox .historyBoxInner .more {
margin-top: 12px;
text-align: right;
text-decoration: underline;
}

/*************************************

SP

*************************************/
@media screen and (max-width: 768px) {
#pankuzu {
display: none;
}

#container .sp {
display: block !important;
}

#container span.pc,
#container br.pc,
#container img.pc,
#container .pc {
display: none !important;
}

#container img.sp,
#container br.sp,
#container span.sp {
display: inline !important;
}

#container {
padding: 0;
}

.mainBox h1 {
font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
font-size: 22px;
font-weight: normal;
margin-bottom: 13px;
}

.subttl {
font-size: 18px;
line-height: 1;
margin-bottom: 10px;
text-align: center;
}

body {
font-family: Lato, "Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.subttl, h2 {
font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
}

h2 {
font-size: 16px;
margin-bottom: 10px;
text-align: center;
}

h3, .subBoxInner .innerTop .read {
font-size: 14px;
margin-bottom: 16px;
}

h4 {
font-size: 14px;
}

h5 {
font-size: 14px;
}

p {
line-height: 1.78;
}

.rf {
float: none;
margin: 0 0 13px;
max-width: 100%;
}

.lf {
float: none;
margin: 0 0 13px;
max-width: 100%;
}

#container img {
width: 100%;
}

/* wrap
--------------------------------------- */
.wrap {
max-width: 768px;
}

/* btn
--------------------------------------- */
.btn {
font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
font-size: 1.4rem;
padding: 8px 0;
}

.btn:before {
height: 8px;
width: 7px;
right: 15px;
}

/* btn
--------------------------------------- */
.btnBox a {
display: block;
margin: 0 auto;
}

.btnBox a:not(:nth-child(2n)) {
margin: 0 auto 16px;
}

/* mainBox
--------------------------------------- */
.mainBox .mainTitleBox .mainTitle {
font-size: 24px;
color: #4b4b4b;
text-shadow: none;
margin-bottom: 0;
position: static;
right: auto;
}

.mainBox .mainTitleBox .mainTitle span {
font-size: 12px;
color: #4b4b4b;
}

.mainBox .dataBox {
margin: 20px 15px 20px;
}

.mainBox .dataBox p {
margin-bottom: 10px;
}

/* localNav
--------------------------------------- */
#localNav {
margin: 20px 0 20px;
text-align: center;
width: auto;
}

#localNav li {
border-bottom: 1px dotted #4b4b4b;
float: none;
width: auto;
}

#localNav li:nth-child(-n+2) {
border-top: 1px dotted #4b4b4b;
}

#localNav li:nth-child(2) {
border-top: 0;
}

#localNav li:nth-child(2n) {
float: none;
}

#localNav li a {
font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
line-height: 1.6;
padding: 5px 0;
}

#localNav li a:before {
height: 12px;
width: 12px;
position: absolute;
right: 15px;
top: 6px;
}

#localNav li:nth-child(2n) a:before {
right: 15px;
}

/* subBox
--------------------------------------- */
.subBox {
background: url(../../images/diamond/cla_terra/bg.gif) repeat-x 0 0 #122745;
background-size: auto;
margin: 0 0 20px;
}

.subBox01 .subBoxInnerSp {
background: url(../../images/diamond/cla_terra/s-img02.jpg) no-repeat 0 120px;
background-size: contain;
}

.subBox02 .subBoxInnerSp {
background: url(../../images/diamond/cla_terra/s-img05.jpg) no-repeat 0 120px;
background-size: contain;
}

.subBoxInner {
margin: 0 15px;
min-height: auto;
}

.subBoxInner .innerTop .midTitle {
width: 100%;
padding: 40px 0 0;
}

.subBoxInner .innerTop .read {
width: 100%;
padding: 20px 0 0;
float: none;
font-family: ヒラギノ明朝 Pro W3, Hiragino Mincho Pro, HGS明朝E, ＭＳ Ｐ明朝, MS PMincho, serif;
}

.subBoxInner .innerBtm .sliderBox {
width: 100%;
padding: 0 0 30px;
float: none;
}

.subBoxInner .innerBtm .sliderBox .mainTitle {
margin: 0;
font-family: ヒラギノ明朝 Pro W3, Hiragino Mincho Pro, HGS明朝E, ＭＳ Ｐ明朝, MS PMincho, serif;
}

.subBoxInner .innerBtm .txt {
width: 100%;
float: none;
}

.subBox .moreBtn {
margin: 30px auto;
}

.subBox .ancInner {
padding: 15px;
}

.subBox .itemInner p {
color: #fff;
}

.subBox .itemInner h3 {
font-size: 18px;
font-family: ヒラギノ明朝 Pro W3, Hiragino Mincho Pro, HGS明朝E, ＭＳ Ｐ明朝, MS PMincho, serif;
margin: 40px 0 20px;
text-align: center;
}

.subBox ul.list,
.subBox ul.list ul li {
overflow: hidden;
zoom: 1;
}

.subBox ul.list {
margin: 0 15px;
}

.subBox ul.list h4 {
font-size: 12px;
text-align: left;
margin: 10px 0;
}

.subBox ul.list li .popup.image::after {
	background: none;
}

.subBox ul.list>li,
.subBox ul.list li ul li {
width: 100%;
}

.subBox ul.list>li {
margin: 0 0 30px;
}

.subBox ul.list>li:nth-child(2) {
margin: 0;
}

.subBox ul.list li ul li a {
float: left;
margin: 0 0 20px 0;
margin-right: 2%;
width: 49%;
}

.subBox ul.list li ul li a:nth-child(2) {
margin-right: 0;
}

.outerWrap {
padding: 0;
}

/*sampleBox,reportBox
--------------------------------------- */
.sampleBox, .reportBox, .historyBox {
padding: 0 15px;
}

.sampleBox h2, .reportBox h2 {
text-align: center;
margin: 40px 0px 20px;
}
.sampleBox h2 {
  margin-top: 0;
}

.sampleBox, .reportBox, .historyBox {
margin: 60px 0;
}
.sampleBox ul.list .slick-slide {
padding: 0 15px;
}
.sampleBox ul.list .slick-next {
right: -5px;
}
.sampleBox ul.list .slick-prev {
left: -5px;
}
/* .sampleBox ul.list li {
width: 100%;
float: none;
margin: 0 0 30px;
} */

.historyBox .historyBoxInner {
border: 1px solid #7f7f7f;
margin: 0;
padding: 25px 15px 28px;
}

.historyBox .historyBoxInner .imgBox {
width: 35.48387096774194%;
}

.historyBox .historyBoxInner h2 {
float: none;
width: auto;
}

.historyBox .historyBoxInner .text {
width: 61.29032258064516%;
}

.historyBox .historyBoxInner h2 {
font-size: 16px;
font-size: 1.6rem;
text-align: center;
}
}