@charset "utf-8";

@media only screen and (min-width: 0px) and (max-width: 640px) {

/* ────────────────────── *
 *                                              *
 * メインビジュアル                             *
 *                                              *
 * ────────────────────── */
#mainvisual {
    position: relative;
}

#mainvisual #txt-main {
    width: 30%;
    top: 40px;
    right: 20px;
}
.slick-slide img.pc {
    display: none;
}
.slick-slide img.sp {
    display: block;
}
#slider .slick-dots {
    display: none!important;
}
/* ────────────────────── *
 *                                              *
 * ピックアップ　                               *
 *                                              *
 * ────────────────────── */
#pickup {
    padding: 0 0 14.0625vw;
}
#pickup h1 {
    font-size: 10px;
    margin-bottom: 10vw;
    padding-top: 10px;
}
#pickup div.pickup-in {
    width: 90.625vw;
}
h2 {
    font-size: 6.25vw;
    text-align: center;
    margin-bottom: 30px;
}
#pickup h2,
#event h2 {
    text-align: left;
}
h2 span {
    font-size: 10px;
}
#slider3.slick-slider {
	width: auto;
}

#pickup div.pickup-in #slider3 div.slick-slide {
    width: 48%;
    margin-right: 20px;
    margin-bottom: 10px;
}
/* ────────────────────── *
 *                                              *
 * イベント　　　                               *
 *                                              *
 * ────────────────────── */

#event {
    width: 90.625vw;
    padding: 14.0625vw 0;
}
#event div.event-box {
    display: block;
    padding-bottom: 20px;
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
}
#event div.event-box div.kasika-box {
    margin-bottom: 0;
    margin-right: 0;
    justify-content: space-between;
}
#event div.event-box div.kasika-box div.event-kashika {
    margin-right: 0;
}
#event div.event-box div.event-list,
#event div.event-box div.event-kashika {
    width: 48%;
    height: auto;
    margin-bottom: 4.6875vw;
    margin-right: 0;
}
#event div.event-box div.event-kashika {
    margin-bottom: 4.6875vw;
}
#event div.event-box div a {
    display: block;
    height: 100%;
    align-items: center;
}

#event div.event-box div figure {
    width: 100%;
}
#event div.event-box div dl {
    padding: 10px;
    width: 100%;
}
#event div.event-box div dl dt {
    font-size: 10px;
    margin-bottom: 5px;
    padding-bottom: 5px;
}
#event div.event-box div dl dd {
    font-size: 10px;
    line-height: 1.6;
}
#event p.btn {
    padding-top: 0;
}

/* ────────────────────── *
 *                                              *
 * コンセプト　　                               *
 *                                              *
 * ────────────────────── */
#concept {
    padding: 14.0625vw 0;
}
#concept div.concept-in {
    width: 90.625vw;
    display: block;
}
#concept div.concept-in div {
    width: 100%;
}
#concept div.concept-in h3 {
    font-size: 7.25vw;
    text-align: center;
    margin-bottom: 20px;
}
#concept div.concept-in p {
    font-size: 3.75vw;
}
#concept div.concept-in figure {
    width: 100%;
    margin-bottom: 20px;
}
p.btn a {
    font-size: 3.75vw;
    width: 51.5625vw;
    padding-left: 20px;
    margin: 0 auto;
}
p.btn a span {
    font-size: 12px;
    right: 5px;
}

/* ────────────────────── *
 *                                              *
 * 理由　　　　　                               *
 *                                              *
 * ────────────────────── */
#reason {
    padding: 14.0625vw 0;
}
#reason div.reason-in {
    width: 90.625vw;
    display: block;
}
#reason div.reason-in div {
    width: 100%;
}
#reason div.reason-in h2 {
    font-size: 7.25vw;
    text-align: center;
    margin-bottom: 20px;
}
#reason div.reason-in p {
    font-size: 3.75vw;
    margin-bottom: 0px;
}
#reason div.reason-in figure {
    width: 100%;
    margin-bottom: 20px;
}

/* ────────────────────── *
 *                                              *
 * ニッケンホームの家づくり                     *
 *                                              *
 * ────────────────────── */
#building {
    padding: 14.0625vw 0;
}
#building div.building-in {
    width: 90.625vw;
    display: block;
}
#building div.building-in div {
    width: 100%;
}
#building div.building-in h2 {
    font-size: 7.25vw;
    text-align: center;
    margin-bottom: 20px;
}
#building div.building-in p {
    font-size: 3.75vw;
    margin-bottom: 0px;
}
#building div.building-in div div.menu p.btn {
    margin-bottom: 0;
    padding-top: 10px;
    display: -moz-flex;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
#building div.building-in div div.menu p.btn a {
    font-size: 3.75vw;
    width: 44.5vw;
    padding-left: 5px;
    margin: 0 auto;
}
#building div.building-in figure {
    width: 100%;
    margin-bottom: 20px;
}

/* ────────────────────── *
 *                                              *
 * 施工事例                                     *
 *                                              *
 * ────────────────────── */

#works {
    padding: 14.0625vw 0;
}
#works h2 {
    text-align: left;
    width: 90.625vw;
    margin: 0 auto 20px;
}
#works .inner.list {
    width: 90.625vw;
    margin: 0 auto;
}
#works .inner.list div {
    width: 100%;
/*    width: 42.8125vw;*/
    margin-bottom: 10.0625vw;
}
#works .inner.list div .spec-data {
    font-size: 10px;
    line-height: 1.5;
}
#works .inner.list div figure {
    position: relative;
    margin-bottom: 5px;
    height: 240px;
}
#works .inner.list div figcaption {
    font-size: 10px;
    color: #a5a5a5;
    padding: 15px 0px 0px 0px;
    background: none;
    position: relative;
}
#works .inner.list div p span {
    font-size: 3.4375vw;
}

/* ────────────────────── *
 *                                              *
 * スタッフ紹介　                               *
 *                                              *
 * ────────────────────── */
#staff {
    padding: 14.0625vw 0;
}
#staff .staff-in {
    width: 90.625vw;
    display: block;
}
#staff .staff-in h2 {
    text-align: left;
}
#staff .staff-in div.blog {
    width: 100%;
}
#staff .staff-in div.blog dl {
    padding: 15px 0;
}
#staff .staff-in div.blog dl:after {
    font-size: 12px;
    right: 10px;
}

#staff .staff-in div.blog dl dt {
    font-size: 12px;
    margin-bottom: 10px;
}
#staff .staff-in div.blog dl dt a {
    margin-left: 20px;
}
#staff .staff-in div.blog dl dd {
    font-size: 12px;
    line-height: 1.7;
    padding-right: 40px;
}
#staff .staff-in div.blog p.btn {
    padding-top: 20px;
    margin-bottom: 50px;
}
#staff .staff-in div.aboutstaff a {
    width: 100%;
}
#staff .staff-in div.aboutstaff a div {
    bottom: 15px;
    left: 15px;
}
#staff .staff-in div.aboutstaff a h2 {
    font-size: 6.25vw;
}
#staff .staff-in div.aboutstaff a h2 span {
    font-size: 10px;
}
#staff .staff-in div.aboutstaff a p {
    font-size: 3.75vw;
    padding-right: 15px;
}

/* よくある質問
--------------------------------------------------------*/
#qa .qa-in {
    width: 87.5vw;
    padding: 14.0625vw 0 12.0625vw;
}
#qa .qa-in .box {
    margin-bottom: 5.125vw;
}
#qa .qa-in .box dl dt.viewmore {
    font-size: 12px;
    padding: 0;
    padding-left: 14.5vw;
    padding-right: 10.9375vw;
}
#qa .qa-in .box dl dt.viewmore:before {
    left: 15px;
}
#qa .qa-in .box dl dt.viewmore:after {
    left: 40px;
    height: 90%;
}
#qa .qa-in .box dl dt.viewmore span::before{/* 閉じている時 */
	right: 10px;
}
#qa .qa-in .box dl dd {
    font-size: 3.125vw;
    padding-left: 0;
/*    padding-left: 17.5vw;*/
}
#qa .qa-in .box dl dd span {
    display: block;
    margin-bottom: 20px;
}
#qa .qa-in .box dl dd span:last-of-type {
    margin-bottom: 0;
}
#qa .qa-in .box .more-contents {
    display: none;
    position: relative;
    padding-bottom: 10px;
}

/* ────────────────────── *
 *                                              *
 * インスタグラム                               *
 *                                              *
 * ────────────────────── */
#ig {
    padding: 14.0625vw 0;
}
#ig h2 {
    width: 90.625vw;
}
.ig-list {
    width: 90.625vw;
}
#sbi_images {
    width: 90.625vw;
}
#sb_instagram #sbi_images .sbi_item {
    width: 90%!important;
}
#sb_instagram .sbi_photo_wrap {
    margin-bottom: 10px;
}
#ig p a {
    margin: 0 auto;
}
/* ────────────────────── *
 *                                              *
 * Youtube                                      *
 *                                              *
 * ────────────────────── */

#youtube {
    padding: 14.0625vw 0;
}
#youtube h2 {
    text-align: left;
    width: 90.625vw;
    margin: 0 auto 20px;
}
#youtube .inner.list {
    width: 90.625vw;
    margin: 0 auto;
}
#youtube .inner.list div {
    width: 42.8125vw;
    margin-bottom: 4.625vw;
}
#youtube .inner.list div figure {
    position: relative;
    margin-bottom: 5px;
    height: auto;
}
#youtube .inner.list div p span {
    font-size: 3.4375vw;
}

/* ────────────────────── *
 *                                              *
 * その他リンク　                               *
 *                                              *
 * ────────────────────── */
#other {
    width: 90.625vw;
    display: block;
}
#other .profile {
    margin-bottom: 5px;
}
#other a {
    width: 100%;
}
#other a div {
    bottom: 15px;
    left: 15px;
}
#other a h2 {
    font-size: 6.25vw;
    text-align: left;
}
#other a h2 span {
    font-size: 10px;
}
#other a p {
    font-size: 3.75vw;
    padding-right: 15px;
}
.gmap iframe {
	height: 300px;
	margin-bottom: 0px;
}
}