@import url(http://fonts.googleapis.com/css?family=Oswald);
/* 一旦リセットします */
* {
	margin: 0;
	padding: 0;
	text-align: center;
}
* {
	padding: 0;
	margin: 0;
	font-size: 100%;
	font-weight: normal;
	list-style-type: none;
}
html, body {
}
body {
	background: #ffffff;
	color: #000000;
	font-size: 13px;
	font-family: Trebuchet MS, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-family: "Times New Roman", Times, serif;
	padding-top: 0px;
	text-align: left;
	-webkit-text-size-adjust: 100%;
	margin: 0 auto;
	line-height: 130%;
}
ul, ul li {
	list-style-type: none;
}
a {
	text-decoration: none;
	color: #333;
}
a:hover {
	filter: alpha(opacity=50);
	-moz-opacity: 0.50;
	opacity: 0.50;
}
.cf:after{
	content: "";
	display: block;
	clear: both;
}
.ul:after{
	content: "";
	display: block;
	clear: both;
}

@media screen and (max-width:640px) {
.pc{
	display:none;
}
}
@media screen and (min-width:641px) {
.sp{
	display:none;
}
}


/* //////////////////// 全体の設定 //////////////////// */

.all_container {
	max-width: 1400px;
	width: 100%;
	overlow: auto;
	padding: 120px 0 30px;
	margin: 0 auto;
	display: block;
}

@media screen and (max-width:640px) {
.all_container {
	max-width: none;
	padding: 10% 0;
}
}
/* //////////////////// header //////////////////// */

section#fixed_position_content {
	position: fixed;
	background: #FFFFFF;
	overflow: hidden;
	width: 96%;
	padding: 10px 2% 10px 2%;
	z-index: 9999;
	box-shadow: rgba(113, 135, 164, 0.129412) 0px 10px 4px -7px;
	-webkit-box-shadow: rgba(113, 135, 164, 0.129412) 0px 10px 4px -7px;
	-moz-box-shadow: rgba(113, 135, 164, 0.129412) 0px 10px 4px -7px;
}
section#fixed_position_content #header {
	text-align: center;
}
section#fixed_position_content #header img {
	width: 120px;
}
p.title {
	padding: 2% 0 2%;
	font-size: 24px;
	font-weight: normal;
}
p.subcomment {
	display: block;
	font-size: 90%;
	font-weight: normal;
	font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	line-height: 1.8em;
	margin-bottom:2%;
}
.taste {
	height: 5%;
	font-size: 100%;
	letter-spacing: 0.1em;
	z-index: 1;
	margin: 0 auto;
	padding: 3% 0 2%;
	max-width: 400px;
	text-align: center;
}
.taste ul li {
	float: left;
	width: 21%;
	margin: 0 auto;
	margin: 0px 2%;
}

.taste ul li button.filter {
	width: 100%;
	border: none;
	font-size: 15px;
	color: #000000;
	text-align: center;
	background-color: #FFFFFF;
	cursor: pointer;
	outline: 0;
	font-family: Trebuchet MS, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	padding: 2px 8px 0px;
	line-height: 20px;
}
.underline--magical {
	background-repeat: no-repeat;
	background-image: linear-gradient(100deg, #eee 0%, #eee 80%);
	background-size: 100% 0.5em;
	background-color: #eee;
	background-position: 0 80%;
	transition: background-size 0.25s ease-in;
}
.underline--magical:hover {
	background-image: linear-gradient(120deg, #A8D9DD 0%, #E19C89 100%);
	background-repeat: no-repeat;
	background-size: 100% 0.5em;
	background-position: 0 80%;
	transition: background-size 0.25s ease-in;
}

@media screen and (max-width:640px) {
section#fixed_position_content #header img {
	width: 30%;
	height: auto;
}
p.title {
	padding: 14% 0 3% 0;
	font-size: 20px;
	font-weight: normal;
}
p.subcomment {
	line-height: 1.8em;
	font-size:10px;
}
.taste {
	width:90%;
	margin:0 auto;
	padding:0;
	margin-top:40px;
	margin-bottom:15px;
}
.taste ul li button.filter {
	font-size: 12px;
}
}
/* //////////////////// STYLING //////////////////// */

.styling_container {
	margin: 0;
	padding: 0;
}
.styling {
	float: left;
	z-index: 99999;
}
.styling ul {
	width: 100%;
	padding: 0;
	margin: 0 auto;
}
.styling ul li {
	float: left;
	width: 19%;
	margin: 0.5% 0.5%;
	cursor: pointer;
	display: none;

}
.styling ul li img {
	width: 100%;
	height: auto;
	display: block;
}
.styling ul li span {
	display: none;
	font-weight: bold;
	font-size: 15px;
	text-align: center;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 83px;
	line-height: 120px;
	background: url(../imgs/opacity40.png) repeat;
	color: #fff;
	z-index: 2;
	-webkit-font-smoothing: antialiased;
}
.styling ul li.active span {
	display: block;
}
@media screen and (max-width:1400px) {
.styling ul {
	width: 90%;
}
.styling ul li {
	width: 24%;
	margin: 0.5% 0.5%;
}
}

@media screen and (max-width:640px) {
.styling ul {
	width: 95%;
}
.styling ul li {
	width: 31.3333%;
	margin: 1% 1%;
}
.styling ul li {
	width: 48%;
	margin: 1% 1%;
}
}
/* //////////////////// MODAL WIN //////////////////// */

#modal-win {
	width: 100%;
	position: absolute;
}
#modal-win-inner {
	margin: 0 auto;
	position: relative;
	z-index: 10001;
}
#modal-bg {
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,.80);
	background-color: rgba(245,245,245,.80);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 10000;
	cursor: pointer;
}
.modal_caption {
	position: fixed;
	top: 42%;
	left: 15%;
	margin: 0px 10px 0px 0px;
	padding: 0px 5px 30px 0px;
	text-align: left;
	color: #222;
}
.modal_caption p.number {
	font-size: 45px;
	padding: 0 0 10px 0;
	text-align: left;
}
.modal_caption p.number img {
	width: 46px;
	padding-right:2px;
}
.modal_caption p.link {
	text-align: left;
	padding-top:12px;
	font-size: 15px;
	font-weight: normal;
	text-decoration: none;
	border-bottom:1px dotted #9E9E9E;
	padding-bottom:5px;
	font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
.modal_caption p.link_txt{
	font-size:0.7em;
	display:block;
	font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	width:140px;
	text-align:left;
	padding:4% 0px;
	color:#666;
}
.modal_caption p.link a{
	padding-left:6px;
}
p.link:before {
  font-family: "Font Awesome 5 Free";
  font-weight: bold;
  content: "\f07a";
  font-size:12px;
}
.large_image {
	width: 490px;
}
.slider-wrapper {
	width: 100%;
	margin: 0 auto;
}
img.bg {
	/* Set rules to fill background */
	min-height: 100%;
	min-width: 1024px;
	/* Set up proportionate scaling */
	width: 100%;
	height: auto;
	/* Set up positioning */
	position: fixed;
	/* またはabsolute; */
	top: 0;
	left: 0;
	z-index: 10;
}
.list {
	clear: none;
	display: inline;
	float: left;
	width: 165px;
	margin: 0px 0px px 0px;
	padding: 0px 15px 15px 0px;
}
.modal-close {
	position: fixed;
	top: 0px;
	right: 0px;
	margin: 0px 10px 0px 0px;
	padding: 0px;
	z-index: 9999;
}
.modal_right {
	position: fixed;
	top: 50%;
	right: 2%;
	margin: 0px 20px 0px 0px;
	padding: 0px 0px 0px 30px;
	z-index: 9999;
}
.modal_left {
	position: fixed;
	top: 50%;
	left: 2%;
	margin: 0px 20px 0px 20px;
	padding: 0px 15px 0px 0px;
	font-size: 11px;
	line-height: 20px;
	z-index: 9999;
}
.title {
	margin: 0px 0px 0px 0px;
	padding: 10px 0px 0px 0px;
	font-size: 11px;
	font-weight: bold;
}
.index {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	font-size: 10px;
	line-height: 18px;
	clear: both;
	display: block;
}
.modal_image {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -300px 20px 0px -250px;
	padding: 0px 0px 0px 10px;
}
.large_image {
	width: 480px;
}
#coord_001, #coord_002, #coord_003, #coord_004, #coord_005, #coord_006, #coord_007, #coord_008, #coord_009, #coord_010, #coord_011, #coord_012, #coord_013, #coord_014, #coord_015, #coord_016, #coord_017, #coord_018, #coord_019, #coord_020, #coord_021, #coord_022, #coord_023, #coord_024, #coord_025, #coord_026, #coord_027, #coord_028, #coord_029, #coord_030, #coord_031, #coord_032, #coord_033, #coord_034, #coord_035, #coord_036, #coord_037, #coord_038, #coord_039, #coord_040, #coord_041, #coord_042, #coord_043, #coord_044, #coord_045, #coord_046, #coord_047, #coord_048, #coord_049, #coord_050, #coord_051, #coord_052, #coord_053, #coord_054, #coord_055, #coord_056, #coord_057, #coord_058, #coord_059, #coord_060, #coord_061, #coord_062, #coord_063, #coord_064, #coord_065, #coord_066, #coord_067, #coord_068, #coord_069, #coord_070, #coord_071, #coord_072, #coord_073, #coord_074, #coord_075, #coord_076, #coord_077, #coord_078, #coord_079, #coord_080, #coord_081, #coord_082, #coord_083, #coord_084, #coord_085, #coord_086, #coord_087, #coord_088, #coord_089, #coord_090, #coord_091, #coord_092, #coord_093, #coord_094, #coord_095, #coord_096, #coord_097, #coord_098, #coord_099, #coord_100, #coord_101, #coord_102, #coord_103, #coord_104, #coord_105, #coord_106, #coord_107, #coord_108, #coord_109, #coord_110, #coord_111, #coord_112, #coord_113, #coord_114, #coord_115, #coord_116, #coord_117, #coord_118, #coord_119, #coord_120, #coord_121, #coord_122, #coord_123, #coord_124, #coord_125, #coord_126, #coord_127, #coord_128, #coord_129, #coord_130, #coord_131, #coord_132, #coord_133, #coord_134, #coord_135, #coord_136, #coord_137, #coord_138, #coord_139, #coord_140, #coord_141, #coord_142, #coord_143, #coord_144, #coord_145, #coord_146, #coord_147, #coord_148, #coord_149, #coord_150, #coord_151, #coord_152, #coord_153, #coord_154, #coord_155, #coord_156, #coord_157, #coord_158, #coord_159, #coord_160, #coord_161, #coord_162, #coord_163, #coord_164, #coord_165, #coord_166, #coord_167, #coord_168, #coord_169, #coord_170, #coord_171, #coord_172, #coord_173, #coord_174, #coord_175, #coord_176, #coord_177, #coord_178, #coord_179, #coord_180, #coord_181, #coord_182, #coord_183, #coord_184, #coord_185, #coord_186, #coord_187, #coord_188, #coord_189, #coord_190, #coord_191, #coord_192, #coord_193, #coord_194, #coord_195, #coord_196, #coord_197, #coord_198, #coord_199, #coord_200 {
	display: none;
}

@media screen and (max-width:640px) {
.modal_caption {
	top: 45%;
	bottom:inherit;
	left: 5%;
	text-align: left;
	color: #000;
	font-size: 1.1em;
}
.modal_caption p.number {
	font-size: 30px;
	padding: 0 0 8px 1px;
	text-align: left;
}
.modal_caption p.number img {
	width: 30px;
	padding-right:2px;
}
.modal_caption p.link {
	text-align: left;
	padding-top:6px;
	font-size: 10px;
	font-weight: normal;
	text-decoration: none;
	border-bottom:1px dotted #9E9E9E;
	padding-bottom:3px;
}
.modal_caption p.link a{
	padding-left:6px;
}
p.link:before {
  font-family: "Font Awesome 5 Free";
  font-weight: bold;
  content: "\f07a";
  font-size:10px;
}
.modal_caption p.link_txt{
	font-size:0.5em;
	display:block;
	font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	width:110px;
	text-align:left;
	padding:4% 0px;
	color:#666;
	line-height:1.18em;
}
.modal-close {
	margin: 0;
	bottom: 2%;
}
.modal-close {
	position: fixed;
	top: inherit;
	right: 2%;
	bottom: 1%;
	margin: 0px 10px 0px 0px;
	padding: 0px;
}
.modal-close img {
	width: 68%;
}
.modal_right {
	top: auto;
	bottom: 2%;
	right: 25%;
	margin: 0px 20px 0px 0px;
	padding: 0px 0px 0px 30px;
}
.modal_left {
	position: fixed;
	top: auto;
	bottom: 2%;
	right: 45%;
	border-right: none;
}
.modal_image {
	top: 15%;
	left: 0;
	margin: -220px 0px 0px 0px;
}
.large_image {
	width: 85%;
	margin: 0 auto;
}
}
/* //////////////////// footer //////////////////// */
#footer {
	background-color: #f5f5f5;
	font-family: Trebuchet MS, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#000;
	margin-top:50px;
	padding-top:60px;
}
#footer h2 {
	padding-bottom: 4px;
	border-bottom: 4px solid #000;
	font-size: 22px;
	font-weight: 500;
	letter-spacing: 0.02em;
	display: inline-block;
	font-family: 'Roboto Condensed', -apple-system, "Hiragino Kaku Gothic ProN", "游ゴシック Medium", メイリオ, meiryo, sans-serif;
	
}
#footer #feature {
	max-width: 900px;
	width: 90%;
	margin: 0 auto;
	padding-bottom:60px;
}
#footer #feature ul {
	overflow: auto;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-top: 30px;
}
#footer #feature li {
	display: block;
	width: 27.3333%;
	float: left;
	padding-right: 3%;
	padding-left: 3%;
	line-height: 24px;
	padding-bottom: 35px;
}
#footer #feature li p {
	display: block;
	float: left;
	padding-right: 10px;
	padding-left: 10px;
	line-height: 1.15rem;
	text-align: left;
	font-size: 11px;
	color: #000;
}
#footer #feature span {
	clear: both;
	display: block;
	width: 230px;
	padding-bottom: 10px;
	padding-top: 15px;
	padding-bottom: 14px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 0px;
	text-align: center;
	border: 1px solid #000;
	color: #000;
}
#community div{
	padding-top:20px;
	}
	#community div a{
		font-weight:bold;
		font-size:11px;
	letter-spacing:0.15em;
	color:#000;
	padding:10px;
	}
	#community div a i{
	padding-right:4px;
	}
.specialOriginalFooterLinkCopyrights {
	color: #999;
	padding-bottom: 30px;
	font-size: 0.85em;
	letter-spacing: 0.15em;
	background-color: #f5f5f5;
	margin-top: 50px;
}
@media screen and (max-width:640px) {
#footer {	padding-top:30px;
}
#footer h2 {
	font-size: 20px;
	
}
#footer #feature {
	padding-top: 0px;
	padding-bottom:50px;
}
#footer #feature ul {
	margin-top: 20px;
}
#footer #feature li {
	width: 29.3333%;
	padding-right: 2%;
	padding-left: 2%;
	padding-bottom: 18px;
}
#footer #feature li p {
	padding-right: 2px;
	padding-left: 2px;
	line-height: 0.7rem;
	font-size: 8px;
}
#footer #feature span {
	width: 70%;
	padding-bottom: 10px;
	padding-top: 13px;
	padding-bottom: 12px;
	font-size:10px;
}
#footer #feature span a{
	color:#000;
}
#community div a{
		font-weight:bold;
		font-size:10px;
	letter-spacing:0.10em;
	color:#000;
	padding:6px;
	}
	#community div a i{
	padding-right:2px;
	}
}

/* //////////////////// page top //////////////////// */
#page-top{
	width: 50px;
	height: 50px;
	display: none;
	position: fixed;
	right: 16px;
	bottom: 16px;
}
 
#page-top p{
   margin:0;
   padding:0;
   text-align:center;
   background:#3b3b3b;
   -webkit-transition:all 0.3s;
   -moz-transition:all 0.3s;
   transition:all 0.3s;
}
 
#page-top p:hover{
   background:#8b8b8b;
}
 
#move-page-top{
	color: #fff;
	line-height: 50px;
	text-decoration: none;
	display: block;
	cursor: pointer;
	z-index: 9999999999999999;
}

/* //////////////////// 専用アイテム非表示 //////////////////// */
/*.P_only{
	display: none;
}*/
.R_only{
	display: none;
}