/* common */
.pc-content {
	display: inherit!important;
}

.sp-content {
	display: none!important;
}

@media only screen and (max-width: 768px) {
	.pc-content {
		display: none!important;
	}

	.sp-content {
		display: inherit!important;
	}
}



/* header */
.header {
    padding: 30px 0;
    position: relative;

    background-color: #fff;
}
@media only screen and (max-width: 768px) {
    .header {

        z-index: 200;

    }
}
@media only screen and (max-width: 480px) {
    .header {

    z-index: 200;

    }
}
.header a {
    text-decoration: none;
}


.header .logo {
    text-align: center;
    padding-bottom: 30px;
}

.header .logo img {
    width: 130px;
    height: auto;
}

.nav-all {
	display: block;
}

.gnav {
    text-align: center;
}

.gnav li {
    display: inline-block;
    margin: 0 10px;
    font-size: 93%;
    line-height: 1;
}


.header .primary {
    position: absolute;
    right: 20px;
    top: 10px;
}

.header .primary li {
    display: inline-block;
    font-size: 85%;
    margin-left: 10px;
    line-height: 1;
}

.nav-bg {
	background-color: #000;
	opacity: 0.4;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
}


@media only screen and (max-width: 768px) {

    .header {
        padding-bottom: 0;
    }

    .gnav {
        border-top: 1px solid #eee;

    }

    .gnav li {
        display: block;
        margin: 0;
        border-bottom: 1px solid #eee;
    }

    .gnav li a {
        display: block;
        padding: 20px 0;
        text-decoration: none;
    }

    .sp-gnav-bottom li:nth-last-child(1) {
        border-bottom: none;
    }

    .header .primary {
        position: relative;
        right: inherit;
        top: inherit;
        text-align: center;
    }

    .header .primary li {
        display: block;
        border-bottom: 1px solid #eee;
        margin-left: 0;
    }

    .header .primary li:nth-last-child(1) {
        border-bottom: none;

    }

    .header .primary li a {
        display: block;
        padding: 20px 0;

    }

    .sp-menu {
        position: absolute;
        bottom: 30px;
        right: 20px;
        cursor: pointer;
        line-height: 1;
        text-align: center;
        color: #666;
    }

    .sp-menu .fa {
        font-size: 21px;
    }

    .sp-menu span {
        display: block;
        font-size: 77%;
    }

    .nav-all {
        position: absolute;
        top: inherit;
        left: inherit;
        background-color: #fff;
        width: 100%;
        display: none;
    }
}

/* footer */
.footer {
    text-align: center;
    padding: 50px 0 10px;
    font-size: 93%;

    background-color: #fef9f2;
}

.footer h2 {
    margin-bottom: 0;
    font-size: 85%;
}

.footer .address,
.footer-contact {
    margin-bottom:  40px;
}

.footer .address p {
    line-height: 1.8;
}

.footer .primary {
    margin-bottom:  10px;
}

.footer .logo {
    margin-bottom: 40px;
}

.footer .primary li {
    display:  inline-block;
    margin: 0 5px;
}

.footer a {
    text-decoration: none;
}

.footer-contact {
    font-size: 100%;
}

.footer-contact a {
    display: inline-block;
    padding: 10px 30px;
    border: 1px solid #eee;
    background-color: #fff;
    line-height: 1;
}

.footer .logo img {
    width: 130px;
    height: auto;
}

.copyright {
    font-size: 93%;
}

/* column */
.wrapper-col {
    width: 100%;
}

.col-bottom {
    margin-bottom: 30px;
}

.wrapper-col.col-03 .col {
    width: 27%;
    margin: 0 4.7%;
    margin-top: 30px;
}

.wrapper-col.col-03 .col:nth-child(3n+1) {
    margin-left: 0;
}

.wrapper-col.col-03 .col:nth-child(3n) {
    margin-right: 0;
}

.wrapper-col.col-03.col-none .col {
    width: 33.3%;
    margin-left: 0;
	margin-right: 0;
}

.wrapper-col.col-02 .col {
    width: 45%;
}

.wrapper-col.col-02.col-none .col {
    width: 50%;
}

.wrapper-col.col-03 .col:nth-child(1),
.wrapper-col.col-03 .col:nth-child(2),
.wrapper-col.col-03 .col:nth-child(3),
.wrapper-col.col-02 .col:nth-child(1),
.wrapper-col.col-02 .col:nth-child(2) {
    margin-top: 0;
}

.col {
    float: left;
}

.wrapper-col.col-02 .col:nth-child(2n) {
    float: right;
}

@media only screen and (max-width: 768px) {

    .wrapper-col.col-03 .col {
        width: 30%;
        margin-left: 2.5%;
        margin-right: 2.5%;
    }
}

@media only screen and (max-width: 480px) {

 	.wrapper-col.col-03 .col:nth-child(3n+1),
	.wrapper-col.col-03 .col:nth-child(3n),
	.wrapper-col.col-03.col-none .col,
	.wrapper-col.col-03 .col {
		width: 46%;
		margin-right: 2%;
        margin-left: 2%;
		margin-top: 30px;
	}

	.wrapper-col.col-03 .col:nth-child(1),
	.wrapper-col.col-03 .col:nth-child(2){
		margin-top: 0;
	}

	.list-blog .wrapper-col.col-03 .col,
	.list-instagram .wrapper-col.col-03 .col,
   	.wrapper-col.col-02.col-none .col,
    .wrapper-col.col-02 .col:nth-last-child(-n+2),
    .wrapper-col.col-02 .col{
        width: 100%;
        float: none;
        margin-right: 0;
        margin-left: 0;
        margin-top: 30px;
    }

	.list-blog .wrapper-col.col-03 .col:nth-child(1),
	.list-instagram .wrapper-col.col-03 .col:nth-child(1),
	.wrapper-col.col-02 .col:nth-child(1){
		margin-top: 0;
	}
}