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

/*----------------------------------------
 1:全体
----------------------------------------*/
/*GoogleWebFonts読み込み*/
@import url('https://fonts.googleapis.com/css?family=Amiri|Noto+Sans+JP:300,400,500|Frank+Ruhl+Libre:300,400,500&display=swap&subset=japanese');

.main{
	color:black;
	font-size:1em;
	line-height: 1.25em;
	letter-spacing: 0.05em;
	font-family: "Amiri", "Noto Sans JP", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: 300;
	text-align: center;
}

@media (max-width:768px) {
	.main{
		font-size:1em;
		line-height: 1.25em;
	}
}

/*リンク*/

.main a {
	color: #707070;
	text-decoration:none;
}
.main a:visited {
	color: #707070;
	text-decoration:none;
}
.main a:hover {
	text-decoration:none;
	opacity: 0.5 ;
}
.main a:active {
	color: #707070;
	text-decoration:none;
}

/*画像*/
img {
	-ms-interpolation-mode: bicubic;
	max-width: 100%;
	vertical-align: top;
}

@media (max-width: 768px){
	img{
		max-width: 100%;
		width: 100%;
	}
}

/*common layout*/
/*画面幅コンテナ*/
.container {
	*zoom: 1;
	margin: 0 auto;
	width: 980px;
	min-width:980px;
}
@media (max-width: 768px) {
	.container {
		width: 100%;
		min-width: 100%;
	}
}

/*----------------------------------------
 2:コンテンツ
----------------------------------------*/

.main__text{
	color:black;
	font-size:1.5em;
	line-height: 1.5em;
	letter-spacing: 0.1em;
	margin-top: 70px;
}

.main__text h1{
	color:black;
	font-size:1.5em;
	line-height: 1.5em;
	letter-spacing: 0.1em;
	margin-top: 70px;
}

@media (max-width: 768px) {
	.main__text{
		font-size:0.9em;
		line-height: 1.25em;
		letter-spacing: 0.1em;
	}
	.main__text h1 {
		font-size:1.25em;
		line-height: 1.5em;
		letter-spacing: 0.1em;
	}
	
	
}

/*----------------------------------------
 3:コーデ見出しデーブル
----------------------------------------*/

.contents__menu {
	margin-top: 150px;
	text-align: center;
}

.contents__menu ul{
	padding: 0 ;
	margin:auto;
	display:table;
	list-style: none;
	width:100%;
}

.contents__menu li{
	padding:2%;
	display: table-cell;
}

@media (max-width: 768px) {
	.contents__menu {
		margin-top: 70px;
		text-align: center;
	}
	.contents__menu ul{
		width:95%;
	}	
}

/*----------------------------------------
 4:コーデset
----------------------------------------*/

/*全体*/
.contents__container{
	margin-top: 200px;
}

@media (max-width: 768px) {
	.contents__container{
		margin-top: 120px;
	}
}


/*見出し*/
.contents__number {
	margin-bottom:50px;
}

/*見出しSP*/
@media (max-width: 768px) {
	.contents__number {
		margin-bottom:50px;
	}
	.contents__number img {
		width:30%;
		max-width: auto;
	}
}

/*コーデ説明テキスト*/
.contents__text{
	margin-top: 50px;
	font-size:1.5em;
	line-height: 1.5em;
}

@media (max-width: 768px) {
	.contents__text{
		font-size:1em;
		line-height: 1.5em;
	}
}

/*使用アイテムテーブル*/
.contents__item{
	margin-top: 50px;
	text-align: center;
}

.contents__item ul{
	padding: 0 ;
	margin:auto;
	display:table;
	list-style: none;
	width:70%;
}

.contents__item li{
	padding:5%;
	display: table-cell;
}

@media (max-width: 768px) {
	.contents__item{
	margin-top: 30px;
}
	.contents__item ul{
		width:100%;
	}
	.contents__item li{
	padding:2%;
	}
}

.contents__item .text {
	margin-top:3%;
	font-size:0.7em;
	line-height: 1.2em;
}

.contents__item .buy {
	margin-top:3%;
	width:80px;
}
@media (max-width: 768px) {
	.contents__item .buy{
		width:50%;
	}
}

/*----------------------------------------
 5:プロフィール
----------------------------------------*/

.profile__container{
	margin: 100px auto ;
	background-color:#ffffff;
	width:700px;
}
.profile__container .profile {
	margin-top: 0px;
}
.profile__container hr {
	margin: 20px auto;
	display:block;
	width: 50%;
	height: 1px;
	border: 0;
	border-top: 1px solid #000000;
}
.profile__text {
	margin-top: 50px;
}

@media (max-width: 768px) {
	.profile__container{
		width:100%;
	}
	.profile__text {
		margin-top: 30px;
		font-size:0.7em;
	}
	.profile__container .profile {
		width:70%;
	}
	.profile__container .name {
		width:30%;
	}
}

/*SNSアイコン横一列*/
.profile__item{
	margin-top: 20px;
	margin-bottom: 30px;
	text-align: center;
}

.profile__item ul{
	padding: 0 ;
	margin:auto;
	display:table;
	list-style: none;
	width:70%;
}

.profile__item li{
	padding:5%;
	display: table-cell;
}

@media (max-width: 768px) {
	.profile__item{
	margin-top: 15px;
	margin-bottom: 30px;
}
	.profile__item ul{
		width:80%;
	}
	.profile__item li{
	padding:2%;
	}
}



/*----------------------------------------
 ex:ふわっと表示jQueryのcss設定
----------------------------------------*/
.fadein {
	opacity : 0;
	transform: translateY(50px);
	transition: all 1s;
	-moz-transform: translateY(50px);
	-webkit-transform: translateY(50px);
	-o-transform: translateY(50px);
	-ms-transform: translateY(50px);
}