@charset "UTF-8";
@import "base.css";
@import "fonts.css";
@import "normalize.css";

html.normal{
	font-size:1.4rem; }

html.min{
	font-size:1.2rem; }

html.max{
	font-size:1.6rem; }

img{
	max-width:100%; }

* {
    padding: 0;
    margin: 0; }

*,
*:before,
*:after {
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box; }

a {
    color: #0C8AAA;
    text-decoration: none; }

a{
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out; }


.red{
    color: #FF0000; }

a:hover,
a:active {
    color: #0C8AAA;
    text-decoration: none; }

a:hover img {
    opacity: 0.7; }

a[target="_blank"]:hover img,
.logo a:hover img,
.f_logo a:hover img,
a:hover img.no-hover {
    opacity: 1; }

h1,
h2,
h3,
h4,
h5,
h6,
input,
button,
textarea,
select,
p,
blockquote,
th,
td,
pre,
address,
li,
dt,
dd {
    font-size: 1.6rem;
    -webkit-text-size-adjust: none; }

/* -- font -- */
h1,
h2,
h3,
h4,
h5,
h6,
p,
li,
dt,
dd,
th,
td,
caption,
address,
figcaption,
small,
label,
time,
input,
button,
select,
textarea {
  font-size: 1.6rem;
  line-height: 1.875; }

li,
dd,
dt,
th,
td {
    line-height: 2em; }

img {
    max-width: 100%; }

p {
    line-height: 2em;
    margin: 0 0 1.1em; }

/******************************Header********************************/

.logo {
    line-height: 0;
    float: left;
    margin: 21px 0px 0px 87px; }

.logo .logo_fix {
    display: none; }

.fixed .h_box,
.under .fixed .h_box,
.index .fixed .h_box {
    height: 60px;
    background: #fff;
    transition: all 0.4s ease; }

.fixed .logo_pc {
    display: none; }

.fixed .logo_fix {
    display: block;
	width:120px; }

.h_box {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10;
    transition: all 0.4s ease;
    -webkit-animation: remove-fixed 0.3s linear;
    -moz-animation: remove-fixed 0.3s linear;
    -ms-animation: remove-fixed 0.3s linear;
    animation: remove-fixed 0.3s linear; }

.index .h_box {
    height: 90px;
    background-color: #008A32; }

.logo_pc{
    width: 140px;
    height: auto; }

.index .fixed .h_box {
    height: 60px;
    line-height: 60px;
    z-index: 500;
    background-color: #008A32; }

.under .h_box {
    padding-top: 30px; }

@keyframes remove-fixed {
    0% {
        opacity: 0.9;
        -webkit-transform: translateY(20%);
        -ms-transform: translateY(20%);
        -moz-transform: translateY(20%);
        transform: translateY(20%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        -moz-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes remove-fixed {
    0% {
        opacity: 0.9;
        -webkit-transform: translateY(20%);
        -ms-transform: translateY(20%);
        -moz-transform: translateY(20%);
        transform: translateY(20%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        -moz-transform: translateY(0);
        transform: translateY(0)
    }
}

@-moz-keyframes remove-fixed {
    0% {
        opacity: 0.9;
        -webkit-transform: translateY(20%);
        -ms-transform: translateY(20%);
        -moz-transform: translateY(20%);
        transform: translateY(20%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        -moz-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes header-fixed {
    0% {
        opacity: 0.5;
        -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        -moz-transform: translateY(0);
        transform: translateY(0);
    }
}

@-webkit-keyframes header-fixed {
    0% {
        opacity: 0.5;
        -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        -moz-transform: translateY(0);
        transform: translateY(0);
    }
}

@-moz-keyframes header-fixed {
    0% {
        opacity: 0.5;
        -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        -moz-transform: translateY(0);
        transform: translateY(0);
    }
}

.fixed .gnavi_pc ul a {
    color: #5A5859;
    font-size: 1.2rem; }

.fixed .gnavi_pc ul .btn {
    display: inline-block;
    position: relative;
    top: -4px; }
    .fixed .gnavi_pc ul .btn a {
        color: #fff;
        padding: 10px 10px 10px 14px; }
        .fixed .gnavi_pc ul .btn a:hover {
            color: #fff; }

.fixed .logo {
    margin: 10px 0px 0px 87px; }

.fixed #gnavi {
	top: 5px; }

.show {
    display: inline-block !important; }

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

/******************************Gnavi********************************/

#gnavi {
    display: flex;
    width: auto;
    position: absolute;
    right: 22px;
    top: 25px;
    margin: 0px; }

.gnavi_pc{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center; }

.gnavi_pc ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; }

.gnavi_pc ul > li {
    display: inline-block;
	position: relative;
    margin:0px 7px; }

.gnavi_pc ul > li:first-child {
    padding-left: 0px; }

.gnavi_pc ul > li:last-child {
    padding-right: 0px;
    background: none; }

* {
    box-sizing: border-box; }

#totop {
    position: fixed;
    bottom: 30px;
    right: 15px;
    z-index: 9;
    line-height: 0;
    margin: 0; }
    #totop a {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 80px;
        width: 80px; }

.inner{
    width: 1100px;
	max-width:96%;
    margin: 0 auto;
    position: relative; }    

#main{
    margin-top: 90px; 
    overflow: hidden; }

.sect_main{
    margin: 0; }
    .sect_main h1{
        font-size: 3.2rem;
        color: #008A32;
        line-height: 1.2;
        padding: 67px 0 0 0;
        font-weight: 500;
        margin: 0;
        text-align: center; }
    .sect_main h2{
        font-size: 2.1rem;
        line-height: 1.2;
        padding: 14px 0;
        font-weight: 500;
        color: #A16920;
        text-align: center; }   
        
    .sect_main_title1{
        max-width: 90%;
        margin: 0 auto;
        padding-top: 54px;
        display: block;
    }

    .sect_main_title2{
        width: 495px;
        max-width: 100%;
        margin: 0 auto;
        padding: 12px 0 18px 0;
        display: block;
    }

    .sect_main .notice{
        text-align: right;
        font-size: 0.9rem;
        color:#FF000F;
        font-weight: 500;
        margin-top: 32px;
    }

.head-part{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start; 
    margin-bottom: 8px; }     
    .head-part .thmbnail{ 
        display: flex;
        align-items: center;
        justify-content: center; }
    .head-part .information{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center; }
        .head-part .information .txt-sect01-01{
            font-size: 2rem;
            line-height: 1;
            padding-bottom: 7px;
            font-weight: 600; }
        .head-part .information .txt-sect01-02{
            font-size: 1.5rem;
            line-height: 1;
            font-weight: 400;
            margin: 10px 0 3px 0;
            text-transform: uppercase; }
        .head-part .information .txt-sect01-03{
            font-size: 1.2rem;
            color: #DF5311;
            line-height: 1;
            font-weight: 600; }
            .head-part .information .txt-sect01-04{
                font-size: 0.8rem; }    

ul.tags{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;}
    ul.tags li{
        list-style: none;
        border-radius: 5px;
        background-color: #fff;
        border:solid 1px #487B17;
        font-size: 1.4rem;
        line-height: 1;
        color: #2C2D2C;
        margin: 7.5px 3.5px;
        padding: 10px 13px; }

.goods-list01{
	margin:0 -10px;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: flex-start; }
    .goods-list01 .goods-item{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-end;
        margin: 10px; }
        .goods-list01 .goods-item .state{
            margin-bottom: 7px;
            width: 50px; }
        .goods-list01 .goods-item .thread{
            margin-bottom: 22px; }
        .goods-list01 .goods-item .desc{
            font-size: 1.2rem;
            margin: 11px 0px;
            line-height: 1;
            color: #2C2D2C; }

.goods-list02{
	margin:0 -10px;
	width:950px;
	max-width:100%;
    display: flex;
	flex-wrap: wrap;
    flex-direction: row;
    align-items: flex-end;
    justify-content: flex-start; }
	.goods-list02.small{
		width:570px;
	}
    .goods-list02 .goods-item{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-end;
		width:168px;
		height:auto;
        margin: 10px; }
        .goods-list02 .goods-item img{
			width:100%;
			height:auto; }
        .goods-list02 .goods-item .desc{
            font-size: 1.2rem;
            margin: 11px 0px;
            line-height: 1;
            color: #2C2D2C; }        
			
.goods-list03{
	max-width:100%;
	margin:0 -14px;
    display: flex;
    flex-direction: row;
	flex-wrap: wrap;
    align-items: flex-end;
    justify-content: flex-start; }
    .goods-list03 .goods-item{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-end;
        margin: 11.5px 14px; }
        .goods-list03 .goods-item .thread{
            margin-bottom: 22px; }
        .goods-list03 .goods-item .cloth{
			width:auto;
			height:266px; }
        .goods-list03 .goods-item .desc{
            font-size: 1.2rem;
            margin: 11px 0px;
            line-height: 1;
            color: #2C2D2C; }

.goods-content{
    font-size: 1.3rem;
    margin-bottom: 0;
    color: #2C2D2C; }
        
.sect_magicnumber{
    margin: 0; 
    padding: 20px 0 61px 0;} 
    .sect_magicnumber .head-part .img-sect01-02{
        width: 137px;
        margin: 0 42px 0 26px; }
    .sect_magicnumber .head-part .information .txt-sect01-01{
		border-bottom: solid 1px #487B17;
        color: #487B17; }
        .sect_magicnumber .head-part .information .txt-sect01-02{
        color: #20A492; }

        .sect_magicnumber .goods-content.txt-sect01-05{
            font-size: 1.3rem;
            margin: 41px 0 19px 0;
            color: #2C2D2C; }
        .sect_magicnumber .goods-content.txt-sect01-06{
            font-size: 1.3rem;
            margin: 19px 0 0px 0;
            color: #2C2D2C; }
        .sect_magicnumber .message{
        border:solid 1px #487B17;
        border-radius: 5px;
        font-size: 1rem;
        padding: 7px 10px;
        line-height: 1.8;
        color: #2C2D2C; }
    .sect_magicnumber .tooltip {
        display:inline-block;
        position:relative; }
    .sect_magicnumber .tooltip .top {
        min-width:415px; 
        top:-40px;
        left:47%;
        transform:translate(-70%, -100%);
        padding:9px 10px 9px 7px;
        color:#487B17;
        background-color:#ffffff;
        font-weight:normal;
        font-size:13px;
        border-radius:8px;
        position:absolute;
        z-index:1;
        box-sizing:border-box;
        border:1px solid #487B17;
        display:block;
        font-size: 1.5rem;
        font-weight: 500;
        line-height: 1;
        text-align: center; }
    .sect_magicnumber .tooltip .top i {
        position: absolute;
        top: 99%;
        left: 85%;
        margin-left: -15px;
        width: 50px;
        height: 20px;
        overflow: hidden; }
    .sect_magicnumber .tooltip .top i::after {
        content: '';
        position: absolute;
        width: 20px;
        height: 40px;
        left: 50%;
        top: -14%;
        transform: translate(-50%,-50%) rotate(56deg);
        background-color: #ffffff;
        border: 1px solid #487B17; }    
    .sect_magicnumber .movie {
        position: relative;
        margin: 130px 0 0 0;
        display: block;
        width: 616px;
        height: 336px; }    
        .sect_magicnumber .movie .ytube {
            position: relative;
            margin-left: auto;
            margin-right: auto;
            max-width: 100%;
            width: 100%;
            height: 100%; }
            .sect_magicnumber .movie .ytube:after{
                content: '';
                display: block;
                position: absolute;
                background: url(../images/movie_btn.svg) no-repeat center;
                background-size: cover;
                width: 88px;
                height: 98px;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                margin: auto;
                z-index: 0; }
            .sect_magicnumber .movie .ytube a {
                width: 100%;
                height: 100%;
                position: absolute;
                top: 0;
                left: 0;
                z-index: 1;
                display: block; }  
			.sect_magicnumber .movie .ytube:hover{
				opacity: 0.7; }

    .sect_magicnumber .sect_magicnumber_goodslist01{
        margin-top: 42px; }
    .sect_magicnumber .sect_magicnumber_goodslist02{
        margin-top: 30px; }
                    
.sect_mohair-hand-red{
    background: url('../images/img-sec02-bg.jpg');
    background-size: cover;
    padding: 69px 0 36px 0; }            
	.sect_mohair-hand-red .head-part .img-sect02-01{
		width: 260px; }
	.sect_mohair-hand-red .head-part .img-sect02-02{
		margin: 0 35px 0 30px; }
		.sect_mohair-hand-red .head-part .information .txt-sect01-01{
			border-bottom: solid 1px #C28F7E;
			color: #C28F7E; }
			.sect_mohair-hand-red .head-part .information .txt-sect01-02{
			color: #6A6366; }
	.sect_mohair-hand-red_goodslist01{
		margin-top: 27px; }
	.sect_mohair-hand-red .goods-content.txt-sect02-05{
		font-size: 1.3rem;
		margin: 41px 0 19px 0;
		color: #2C2D2C; }

.sect_mohair-hand-red-great{
	padding: 69px 0 36px 0; }
	.sect_mohair-hand-red-great .head-part .img-sect02-01{
		width: 260px; }
	.sect_mohair-hand-red-great .head-part .img-sect02-02{
		margin: 0 35px 0 30px; }
		.sect_mohair-hand-red-great .head-part .information .txt-sect01-01{
			border-bottom: solid 1px #4E494D;
			color: #4E494D; }
			.sect_mohair-hand-red-great .head-part .information .txt-sect01-02{
			color: #B49F78; }
	.sect_mohair-hand-red-great_goodslist01{
		margin-top: 27px; }
	.sect_mohair-hand-red-great .goods-content.txt-sect03-05{
		font-size: 1.3rem;
		margin: 41px 0 19px 0;
		color: #2C2D2C; }

.sect_landscape{
    background: url('../images/img-sec04-bg.jpg');
    background-size: cover;
    padding: 69px 0 36px 0; }            
	.sect_landscape .head-part .img-sect02-01{
		margin:0 0 0 40px;
	}
	.sect_landscape .head-part .img-sect02-02{
		width:197px;
		margin: 0 28px 0 30px; }
		.sect_landscape .head-part .information .txt-sect01-01{
			border-bottom: solid 1px #4D6E86;
			color: #4D6E86; }
			.sect_landscape .head-part .information .txt-sect01-02{
			color: #598F9E; }
	.sect_landscape .goods-content.txt-sect04-05{
		font-size: 1.3rem;
		margin: 41px 0 19px 0;
		color: #2C2D2C; }

.sect_perfavore{
    background-size: cover;
    padding: 69px 0 36px 0; }            
	.sect_perfavore .head-part .img-sect02-01{
		width:230px; }
	.sect_perfavore .head-part .img-sect02-02{
		width:94px;
		margin: 0 21px 0 33px; }
		.sect_perfavore .head-part .information .txt-sect01-01{
			border-bottom: solid 1px #494645;
			color: #494645; }
			.sect_perfavore .head-part .information .txt-sect01-02{
			color: #796B76; }
	.sect_perfavore .goods-content.txt-sect05-05{
		font-size: 1.3rem;
		margin: 41px 0 19px 0;
		color: #2C2D2C; }

.sect_moimoi_solid{
    background: url('../images/img-sec06-bg.jpg');
    background-size: cover;
    padding: 69px 0 36px 0; }            
	.sect_moimoi_solid .head-part .img-sect02-01{
		margin:0 0 0 9px;
	}
	.sect_moimoi_solid .head-part .img-sect02-02{
		width:110px;
		margin: 0 19px 0 30px; }
		.sect_moimoi_solid .head-part .information .txt-sect01-01{
			border-bottom: solid 1px #2F8483;
			color: #78F3F2; }
			.sect_moimoi_solid .head-part .information .txt-sect01-02{
			color: #93BECA; }
	.sect_moimoi_solid .goods-content.txt-sect06-05{
		font-size: 1.3rem;
		margin: 41px 0 19px 0;
		color: #2C2D2C; }

.sect_moimoi_misto{
    background-size: cover;
    padding: 69px 0 36px 0; }            
	.sect_moimoi_misto .head-part .img-sect02-01{
		margin:0 0 0 9px;
	}
	.sect_moimoi_misto .head-part .img-sect02-02{
		width:92px;
		margin: 0 19px 0 30px; }
		.sect_moimoi_misto .head-part .information .txt-sect01-01{
			border-bottom: solid 1px #B2A983;
			color: #B2A983; }
			.sect_moimoi_misto .head-part .information .txt-sect01-02{
			color: #9D9D9C; }
	.sect_moimoi_misto .goods-content.txt-sect07-05{
		font-size: 1.3rem;
		margin: 41px 0 19px 0;
		color: #2C2D2C; }

.sect_moimoi_multimist{
    background: url('../images/img-sec08-bg.jpg');
    background-size: cover;
    padding: 69px 0 36px 0; }            
	.sect_moimoi_multimist .head-part .img-sect02-01{
		margin:0 0 0 9px;
	}
	.sect_moimoi_multimist .head-part .img-sect02-02{
		width:110px;
		margin: 0 19px 0 30px; }
		.sect_moimoi_multimist .head-part .information .txt-sect01-01{
			border-bottom: solid 1px #9B8380;
			color: #7F605C; }
			.sect_moimoi_multimist .head-part .information .txt-sect01-02{
			color: #9D9D9C; }
	.sect_moimoi_multimist .goods-content.txt-sect08-05{
		font-size: 1.3rem;
		margin: 41px 0 19px 0;
		color: #2C2D2C; }

#footer{
    background-color:#fff; }
    #footer .social-buttons{
        display:flex;
        flex-direction:row;
        align-items:center;
        justify-content:center; 
        padding:76px 0px }
        /*#footer .social-buttons div{
            margin:0 23px; }*/
        #footer .footer-logo{
            width:162px;
            margin:79px auto 43px auto;
            display:block;
        }
        #footer .copyright{
            font-size:1rem;
            line-height:1;
            color:#2C2D2C;
            text-align:center;
            text-transform: uppercase; 
            display:block;
            margin-bottom:30px;
        }
/* sns button start*/		
.social-buttons {
    height: 20px;
}
.page-snsbtn {
    display: flex;
    margin: 10px auto 0;
    justify-content: flex-start;
    max-width: 800px;
}
.page-snsbtn iframe,
.page-snsbtn div {
    margin-right: 5px;
}
.social-buttons iframe,
.social-buttons span {
    vertical-align: top !important;
}
.social-buttons div iframe {
    margin-right: 1px !important;
}			
/* sns button end*/