@charset "UTF-8";


.pconly{display:table}
.tabonly{display: none}
.pctabonly{display:table}
.tabsponly{display: none}	

.sponly{display: none}
	/* マイルストーントップ PC*/  

.bt_list a{color:#fff;font-size: 14px ;display: block}

.bt_list a:hover{text-decoration: none}
	
	section h2.ttl{color:#3c6091;
	text-align: center;
		font-size: 35px;font-weight: bold;
	margin: 20px auto 15px}
	
	section .ttl_jp{font-size: 20px;font-weight: bold;margin-bottom: 30px;}
	
	
	section .bt_list{width: 150px;
		padding: 10px 0 ;
		font-size: 12px;
		margin: 20px auto;
	 border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  ;
	background-color:#d96500;
	color: #fff}
	
	section .news_main{max-width: 1300px;
		margin: 50px auto 0;
	width: 100%}
	

	
	section .news_main img{width: 80%;margin: 20px auto}
/*	
	section .news_main .news_more{width: 100%;
	background-image: url(http://www.milestone-net.co.jp/wp/wp-content/uploads/2021/11/news_arrow2-1.png);
	height: 90px;
	background-repeat: no-repeat;
	color: #fff;
		margin: 10px 10px;
		padding: 40px 10px;
		font-size: 13px;
		position: absolute;
		left: 0;
		bottom: 20px;
	background-size: contain;
}
*/

section .news_main .news_more{
    padding: 11px 11px;
    font-size: 13px;
    position: absolute;
	color: #fff;
    left: 0;
    bottom: 20px;
    background-color: #3d6191;
}

.slid-width2{
    animation-name: slid-width2;
    animation-duration: 1s;
    animation-fill-mode: forwards;
	opacity: 1 !important;
}

@keyframes slid-width2 {
    0% {
        width: 0%;         
    }
    100% {
		width: 70%;
    }
}

.slid-width3{
    animation-name: slid-width3;
    animation-duration: 1s;
    animation-fill-mode: forwards;
	opacity: 1 !important;
}

@keyframes slid-width3 {
    0% {
        width: 70%;         
    }
    100% {
		width: 0%;
    }
}

.con-under-line{
height: 10px;
background-color: #3d6191;
bottom: 0;
position: absolute;
}

.slid-width4{
animation-name: slid-width4;
animation-duration: 1s;
animation-fill-mode: forwards;
transition: all 0.5s ease-in;
}

@keyframes slid-width4 {
    0% {
        width: 0%;         
    }
    100% {
		width: 100%;
    }
}

.slid-width5{
animation-name: slid-width5;
animation-duration: 1s;
animation-fill-mode: forwards;
}

@keyframes slid-width5 {
    0% {
        width: 100%;         
    }
    100% {
		width: 0%;
    }
}

section .news_main .news_more a{color: #fff;text-decoration: none}
section .news_main .news_more a:hover{color: #fff;text-decoration: none}
	
	section .news_main .txt{margin: 0 20px;line-height: 1.6em;font-size: 14px}
	
	.news_main ul{display: block}
	
	.news_main ul li{list-style:none;
		float: left;
		padding: 10px 0px;
		text-align: left;
		/* 
		background: -webkit-gradient(
                  linear
                , left top
                , left bottom
                , from(#fff)
                , color-stop(0.50, #ddd)
                , to(#fff));
		background:-ms-linear-gradient(top, #fff, #ddd, #fff);  IE 
		border-left: solid 1px #ccc;*/
		border-right: solid 5px #fff;
		height: 550px;
		position: relative;
		background-color: #f9f9f9;
        border-radius: 5px;
	}
	
	/*
	.news_main ul li:nth-child(2n){margin-top: 50px;}
	
		.news_main ul li:nth-child(3n){margin-top: 50px;}
	*/
			.news_main ul li:nth-child(4n){margin-top: 0px;}
	
	section .news_main h3 a{font-size: 20px;font-weight: bold;
		line-height: 1.3em;
	margin:0;color: #333;text-align: left}

section .news_main a:hover{text-decoration: none}

section .news_main a.link{color: #333;font-family: "メイリオ", Meiryo, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial,sans-serif;margin: 0 20px;display: block; padding: 0 ;line-height: 1.6em;font-size: 14px;}
	
	section .news_main .day{margin: 0 20px;font-size: 13px}
	
	
.top_news{max-width: 1300px;
	margin: 0 auto;
		width: 100%;
	height: 800px;}




/* --- 新着情報エリア --- */
/*
.top_topics{margin-bottom: 80px;
	padding-bottom: 40px;
background: -webkit-gradient(
                  linear
                , left top
                , left bottom
                , from(#fff)

                , to(#ddd));
		background:-ms-linear-gradient(top, #fff, #ddd);  IE 
border-bottom: solid 4px #ccc
}
*/

.top_topics{
margin: 75px 0;
padding: 85px 0;
background-color: #f9f9f9;
}


div.update {
width: 100%; /* 新着情報エリアの幅 */
	max-width:  850px;
	margin: 0 auto;
font-size: 13px;
}



/* --- 新着リスト --- */
div.update dl {
width: 100%; /* 新着リストの幅 */
margin: 0;
	height: 100%
}

/* --- 日付エリア --- */
div.update dt {
width: 6.7em; /* 日付エリアの幅 */
float: left;
padding: 20px 0 6px 10px; /* 日付エリアのパディング（上右下左） */
line-height: 120%;
	font-weight: normal
}

/* --- 本文エリア --- */
div.update dd {
margin: 0;
padding: 20px 10px 6px 9em; /* 本文エリアのパディング（上右下左） */
	text-align: left;
line-height: 120%;
}


div.update a{color: #333;text-decoration: none}



/* マイルストーントップコンテンツ PC*/  

	section .top_contents{max-width: 1300px;
		margin: 50px 0 0;
	width: 100%}
	

	
	section .contents_main img{width: 50%;margin: 20px auto}
	
	section .contents_main .news_more{width: 100%;
	background-image: url(../images/news_arrow.png);
	height: 90px;
	background-repeat: no-repeat;
	color: #fff;
		margin: 10px 0;
		padding: 40px 10px;
		font-size: 13px;
		position: absolute;
		left: 0;
		bottom: 20px;
	background-size: contain;
}
	
	section .contents_main .contents_txt{margin: 30px 20px;line-height: 1.3em;font-size: 18px;text-align: center;color:  #3c6091;font-weight: bold}
	
	.contents_main ul{display: block; margin-bottom: 80px}
	
	.contents_main ul li{list-style:none;
		float: left;
		padding: 10px 0px;
		text-align: left;
		/*border: solid 1px #ccc;*/
		margin-right: 1%;
		height: 270px;
		width: 24%;
		position: relative;
		border-radius: 5px;
		background-color: #ffffff;
	}

/*
.contents_main ul li:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 0;
  border-bottom: 25px solid #3c6091;
  border-right: 25px solid transparent;
}

.contents_main ul li:after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 0;
	border-bottom: 10px solid #3c6091;
	border-right: 10px solid #3c6091;
}
*/

.contents_main  ul li a{display:block}

.contents_main  ul li a:hover{text-decoration:none}

.contents_main  ul li:nth-child(1n){margin-top: 0;}
/*
.contents_main  ul li:nth-child(2n){margin-top: 25px;}
	
		.contents_main  ul li:nth-child(3n){margin-top: 25px;}
*/
.contents_main  ul li:nth-child(4n){margin-top: 0;}
	
		


	
	section .news_main h3{font-size: 20px;font-weight: bold;
		line-height: 1.3em;
	margin:15px 20px 15px}
	
	section .news_main .day{margin: 0 20px;font-size: 13px}


	
.top_news{max-width: 1300px;
	margin: 0 auto;
		width: 100%;
	height: 800px;}

/* マイルストーンプロダクト PC*/  


.product_img_l{width: 100%}

.product_top{
max-width: 1400px;margin: 80px auto }

.produt_ttl img{width: 140px;display: inline-block;margin-right: 10px;}

.produt_ttl{text-align: left;width: 100%; display: flex;flex-direction: row;align-items: center;}

.product_img img{width: 100%}

.product_main h2{font-size: 30px;
margin: 20px 0;
font-weight: bold}

.produt_ttl2{font-size: 16px;
line-height: 1.5em}

.product_ttl_main{text-align: left}

ul.spec li{font-size: 14px;
margin: 10px 0 0 20px;
list-style: disc}

ul.spec {
	margin-top:20px;
    background: #e9e9e9;
    padding: 10px;
    border-radius: 4px;
}

.most-movie {
	position: relative;
	padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
	height: 0;
	overflow: hidden;
}

.most-movie iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.product_thumbnail {clear: both; width: 100%;}
.product_thumbnail ul{display: block;
margin: 30px auto 50px}

.product_thumbnail ul li{float: left;
width: 20%}

.product_thumbnail ul li img{
width:90%}

.bt_tab{margin:0 auto; text-align:center; width:67%; /*background-color: #d5d5d5;*/ padding: 6px 0;display: flex;align-content: center;justify-content: center;flex-wrap: nowrap;}

.bt_tab ul{display: inline-block;
/*margin: 0 auto*/
}

.bt_tab ul li{display: inline-block;width: 150px;}
.bt_tab ul li.nav-pills-buy{display: inline-block;width: 240px;}
.bt_tab ul li.nav-pills-buy a{background-color: #d40000;color: #fff;}

.spec_hyo{width: 100%;
max-width: 1280px;
	padding:0 0px 20px;
margin: 0 auto;
font-size: 13px}
.spec_hyo:first-child{padding: 20px 0;}

.spec_title {font-size: 14px; font-weight: bold; margin-bottom: 5px; }
.chu{font-size: 12px;
margin-top: 10px}
.spec_hyo img{max-width: 100%; margin: 10px auto;}


.bk_head_pc{background-color: #fff; position:fixed; top:0;left: 0; width: 100%;height: 90px;z-index:888;}


.title{text-align: center;}

.title h1{font-size: 40px;
line-height: 1em;
font-weight: bold;color: #3c6091;
margin: 40px 0;}

.title h1 .jp{color: #1a1311;font-size: 25px}

.bt_back{margin: -20px auto 20px; text-align: right; width: 100%; max-width: 1300px;}

.bt_product{margin:0 auto 20px; text-align:center; width:100%;background-color: #ebf2f2; padding: 20px 0;max-width: 1300px}

.bt_product ul{display: inline-block;
margin: 0 auto
}

.bt_product ul li{display: inline-block;padding: 0 5px;}

.bt_product ul li a{text-decoration: none;color: #515151}
/*.bt_product ul li.current a{background: #ffffcc;}*/



.product_list ul{
margin: 30px auto 50px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
}

.product_list ul li{
float: left;
width: 25%;
border-collapse:collapse;
border: 1px solid #e0e0e0;
height: 500px;
display: flex;
flex-direction: column;
}

.product_list ul li img{
margin-top: 10px;
width:90%
}

.product_list h2{
font-size: 20px;
font-weight: bold;
padding: 10px 20px;
height:70px;
overflow: visible;
margin-bottom: 10px;
}


.product_list p{font-size: 13px;
font-weight: normal;
padding:0 20px 10px;
line-height: 1.6em;
max-height:130px;
overflow: visible;
}

.product_list a{color: #1a1311}
.product_list a:hover{color: #1a1311;text-decoration: none}

.product_list .purchase_button{padding: 0 20px 20px;line-height: 1.6em}
.product_list .purchase_button a{color: #f90;}
.product_list .purchase_button img{width: 180px;}


.bt_product_maker{margin:0 auto 20px; text-align:center; width:100%;background-color: #ebf2f2; padding: 20px 20px 20px 30px;max-width: 1300px}

.bt_product_maker ul{display: inline-block;
margin: 0 auto;
	text-align: left
}

.bt_product_maker ul li{display: inline-block;margin-right:30px;margin-bottom: 5px;margin-top: 5px}

.bt_product_maker ul li a{text-decoration: none;color: #515151}
/*.bt_product_maker ul li.current a{background: #ffffcc;}*/

.top_line{border-top: solid 1px #cdcdcd}

dl.list_maker dt {
  float: left ;
  clear: both ;
  width: 200px ;
  height: 120px ;
  line-height: 50px ;
	padding: 15px 0;
	border-bottom: solid 1px #cdcdcd
}

dl.list_maker dt img{width: 80%;margin-top: 10px}
dl.list_maker dt a{display: block; width: 80%; height: 100%; margin: 0 auto;}
dl.list_maker dd {
  margin-left: 200px ;
 display: block ;
  height: 120px ;padding: 15px 0;
  line-height: 50px ;border-bottom: solid 1px #cdcdcd
}

dl.list_maker dd p{margin:3% 0 0 20px;}

dl.list_maker dd a{float: left;margin-right: 40px}

.asus{background-image:url(../product/images/logo_ASUS.png);
background-size:80%;
background-position:center;
background-repeat: no-repeat}


.cougar{background-image:url(../product/images/logo_orangecougar.png);
background-size:contain;
background-position:center;
background-repeat: no-repeat}


.easars{background-image:url(../product/images/logo_easars.png);
background-size:80%;
background-position:center;
background-repeat: no-repeat}

.epicgear{background-image:url(../product/images/logo_EpicGear.png);
background-size:80%;
background-position:center;
background-repeat: no-repeat}


.evga{background-image:url(../product/images/logo_EVGA_logo_black.png);
background-size:80%;
background-position:center;
background-repeat: no-repeat}


.geil{background-image:url(../product/images/logo_GeIL.png);
background-size:80%;
background-position:center;
background-repeat: no-repeat}


.hec{background-image:url(../product/images/logo_hec_logo_large.png);
background-size:80%;
background-position:center;
background-repeat: no-repeat}


.hyperx{background-image:url(../product/images/logo_hyperX_white.png);
background-size:80%;
background-position:center;
background-repeat: no-repeat}

.jinx{background-image:url(../product/images/logo_jinx.png);
background-size:80%;
background-position:center;
background-repeat: no-repeat}

.kingstone{background-image:url(../product/images/logo_Kingston.png);
background-size:80%;
background-position:center;
background-repeat: no-repeat}


.mailestone{background-image:url(../product/images/logo_milestone.png);
background-size:80%;
background-position:center;
background-repeat: no-repeat}


.next_level{background-image:url(../product/images/logo_next-level.jpg);
background-size:80%;
background-position:center;
background-repeat: no-repeat}


.razer{background-image:url(../product/images/logo_razer.jpg);
background-size:80%;
background-position:center;
background-repeat: no-repeat}



/* マイルストーン企業情報 PC*/  
.corp_top{
max-width: 1300px;margin: 80px auto 0}


.spec_table{width: 100%}

.spec_table table{width: 100%}

.spec_table td{padding:20px 10px;
	line-height: 1.6em;
border-bottom: solid 1px #aaa;
font-size: 15px}

.map_main{margin: 50px 0 20px}

.access_txt{line-height: 2em; margin-bottom: 50px;padding:0 10px}




/* マイルストーンプライバシーPC*/  
.privacy_top{
max-width: 1300px;margin: 80px auto 0;
padding: 0 20px}

.privacy_top p{font-size: 14px;line-height: 1.6em}


.privacy_top h2{font-size: 25px;line-height: 1.6em;color: #3c6091;
border-bottom: solid 1px #aaa;margin: 50px 0 10px;font-weight: bold}


/* マイルストーンサポートPC*/  
.support_top{
max-width: 1100px;margin: 80px auto 0;
padding: 0
}

.support_top p{font-size: 14px;line-height: 1.6em;padding: 0}

a.bt_contact{font-size: 16px;background-color: #3c6091;padding:15px 20px;color: #fff;
display: inline-block;margin: 20px auto; border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */}

a.bt_contact:hover{color: #fff;
text-decoration: none}

.support_top h2{font-size: 25px;line-height: 1.6em;color: #3c6091;
border-bottom: solid 1px #aaa;margin: 50px 0 10px;font-weight: bold;text-align: center;}

.contact_main{text-align: center}

.sup_chu{font-size: 13px}


/* 固定ページ汎用 */
.page_top {max-width: 660px; margin: 20px auto 40px; line-height: 1.6; }
.page_top img {display: inline; max-width: 100%; height: auto;}
.page_top h3 {margin-bottom: 20px; font-weight: bold; font-size: 18px;}
.page_top h4 {margin-bottom: 19px; font-weight: bold; font-size: 18px;}
.page_top p {margin-bottom: 20px; }
.page_top ul {margin-bottom: 20px; list-style: inside disc; }
.page_top table {width: 100%; margin-bottom: 20px; border: 1px solid #666; border-collapse: collapse;}
.page_top th {border: 1px solid #666; padding: 2px 5px; font-weight: bold; }
.page_top td {border: 1px solid #666; padding: 2px 5px;}


/* マイルストーン ニュースPC*/  
.news_top{
max-width: 1100px;margin: 0px auto 0;
padding: 0}

.news_top p{font-size: 12px;line-height: 1.6em;padding: 0;margin: 20px 0}

a.bt_contact{font-size: 16px;background-color: #3c6091;padding:15px 20px;color: #fff;
display: inline-block;margin: 20px auto; border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */}

a.bt_contact:hover{color: #fff;
text-decoration: none}

.news_top h2{font-size: 30px;line-height: 1.6em;color: #3c6091;
border-bottom: solid 1px #aaa;margin: 50px 0 10px;font-weight: bold}

.news_pic{width: 100%}

.news_list_title{font-size: 18px;font-weight: bold}


.news_list {margin-bottom: 50px}

.news_list ul li{border-bottom: 1px #aaa solid;
padding: 20px 0}

.news_list ul li a{color: #3c6091}

.news_list ul li a:hover{color: #3c6091;
text-decoration: none}

 .bt_all a{display: inline-block;font-size: 14px;padding:10px 10px;line-height: 1em;color: #fff;font-weight: bold;margin: 0 auto;background-color: #3c6091;height: 10px;height: 35px;
	margin: 0 auto;display: inline-block;margin: 0 auto;
	border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */}

.bt_all a:hover{text-decoration: none}

.bt_all {width: 100%;text-align: center}

.news_list .info_title{font-size: 25px}

.news_list .day{margin-bottom: 20px}

.news_top .info_title2{font-size: 18px;font-weight: bold;margin-top: 20px;margin-bottom: 0px}

/*.news_box img{margin: 30px auto;width: 100%}*/
/*.news_box img{margin: 0px 0; max-width: 100%;height: auto;} 

.news_top strong{font-weight: bold;}


/* マイルストーン 修理のご依頼についてPC*/  
.repair_top{
max-width: 1100px;margin: 0px auto 0;
padding: 0}

.repair_top p{font-size: 14px;line-height: 1.6em;padding: 0;margin: 0}

.repair_top table{width: 100%}
.repair_top table td{font-size: 12px;vertical-align:middle;

}



.repair_top .input_w{width: 100%}

.repair_top .input_w2{width: 80%}

/* マイルストーン 予約カレンダーPC*/  
.showroom{
max-width: 1100px;margin: 0px auto 0;
padding: 0}

.showroom p{font-size: 14px;line-height: 1.6em;padding: 0;margin: 0}

.showroom table{width: 100%; max-width: 640px;}
.showroom table td{font-size: 14px;vertical-align:middle;}

.showroom.showroom-thanks p{margin-bottom: 20px;}

.wname{width: 200px}

.contact-input .select-wrap{
position:relative;
overflow:hidden;
display:inline-block;
min-width:100px;
background-color:#e6ecf3;
border:1px solid #c0c0c0;
color:#333;
	background: url(../images/support/images.png) right 50% no-repeat, -webkit-linear-gradient(top, #e6ecf3 0%,#e6ecf3 100%);
	background: url(../images/support/images.png) right 50% no-repeat, linear-gradient(to bottom, #e6ecf3 0%,#e6ecf3 100%);
	background-size: 10%
}

.contact-input .select-wrap select{
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
position:relative; font-family:  "メイリオ", Meiryo, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial,sans-serif;
z-index:2;
display:block;
width:200%;/* fallback non calc support */
width:-webkit-calc(100% + 5em);
margin:0;
padding:11px 30px 11px 11px;
background:transparent;
border:0;
outline:none;
font-size:14px;
line-height:1.5;
}

.entypo-down-open-mini:before{
/* content:''; 今回のサンプルはCDNを使っているため指定していないけど指定する必要があります。 */
font-family:'entypo',sans-serif;
position:absolute; font-family:  "メイリオ", Meiryo, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial,sans-serif;
z-index:1;
top:50%;
right:12px;
right:.75rem;
margin-top:-8px;
margin-top:-.5rem;
font-size:16px;
font-size:1rem;
line-height:1;
color:#333;
}

textarea{height:100px;}

.bt_check{padding: 10px 20px;
	 font-family:  "メイリオ", Meiryo, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial,sans-serif;
	color: #fff;
	font-size:14px; 
	background-color:  #3c6091;
	width: 150px;
	border: none;
	border-radius: 10px;		/* CSS3草案 */
	-webkit-border-radius: 10px;	/* Safari,Google Chrome用 */
	-moz-border-radius: 10px;	/* Firefox用 */
}

.contact-confirm input[type="reset"]{display: none;}
.bt_clear{padding: 10px 20px;
	 font-family:  "メイリオ", Meiryo, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial,sans-serif;
	color: #fff;
	font-size:14px; 
	background-color: #6F6F6F;
	width: 150px;
	border: none;
	border-radius: 10px;		/* CSS3草案 */
	-webkit-border-radius: 10px;	/* Safari,Google Chrome用 */
	-moz-border-radius: 10px;	/* Firefox用 */}

.section_main .logo_mark img{width: 60%;margin: 0 auto;}

.section_main .bt_maker{text-align: center}

.section_main .bt_maker ul li{
	float: left;
	display: inline-block;
    margin:10px 5px
}

.section_main .bt_maker ul{display: inline-block;
margin: 10px auto 0}


.section_main .bt_maker a{padding: 10px 20px;
	 font-family:  "メイリオ", Meiryo, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial,sans-serif;
	color: #fff;
	font-size:14px; 
	background-color:  #3c6091;
text-decoration: none;
	border: none;
	border-radius: 10px;		/* CSS3草案 */
	-webkit-border-radius: 10px;	/* Safari,Google Chrome用 */
	-moz-border-radius: 10px;	/* Firefox用 */
}


.security_img img{width: 80%}

.main404{margin: 120px auto;
	padding-bottom: 400px;
max-width: 1300px}

.main404 p{line-height: 1.6em}

.size_404{font-size: 30px;
color:#3c6091;}

.for-top{text-align: left}

.shopify_test{
/*	
width: 50%;
margin: 60px auto;
display: flex;
flex-direction: row;
justify-content: center;
flex-wrap: wrap;
align-content: center;
*/
}

.product_spec{
position: fixed;
top: 90px;
width: 100%;
z-index: 10;
font-size: small;
background-color: #e9e9e9;
}

.topgia{
margin-top: 130px;
}

.bt_title{
width: 20%;
font-size: medium;
font-weight: bold;
display: flex;
align-items: center;
justify-content: flex-start;
color: #444444;
}

.bt_ul_width{
width: 80%;
display: flex;
justify-content: flex-end;
}

#dis_anchor{
padding-top: 120px;
margin-top: -120px;
}

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

.product_spec {
top: 59px;
}
	
}


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

.product_main{
margin-top: 200px
}

.bt_title{
width: 100%;
margin-bottom: 5px;
font-size: small;
}
		
.bt_ul_width{
width: 100%;
font-size: x-small;
}

.tab-content{
margin-top: 25px;
}

/*
#dis_anchor{
padding-top: 160px;
margin-top: -160px;
}
*/

.produt_ttl img{
margin-bottom: 5px;
}

.produt_ttl{
display: flex;
justify-content: center;
align-content: center;
flex-wrap: wrap;
}

.product_main h2{
font-size: 25px;
text-align: center;
}

.product_ttl_main{
background: #f4f9f9;
padding-top: 30px;
padding-bottom: 30px;
}

.news_box table td, table.type01 td{
padding: 5px;
}

}


.shopify-buy__btn-wrapper {
margin-top: 0 !important;
}

.shopify-buy__btn {
padding: 5px 40px !important;
}

.sec_vid_con{
	display: flex;
    justify-content: center;
    align-items: flex-end;
    color: white;
    font-size: xx-large;
    font-weight: bold;
    margin: 100px 0 120px 0;
    background-color: #fff;
}

.sec_vid_con_overlay{
    background: black;
    width: 100%;
    height: 10%;
    position: absolute;
    opacity: 0.6;
}

.sec_vid_con_text{
    position: absolute;
    color: white;
}

.sec_vid_con_bg{
    background: black;
    width: 100%;
    height: -webkit-fill-available;
    position: absolute;
    z-index:-1
}

.sec_vid_con video{
width: 85%;
}

.vidcontext{
font-size: small;
padding: 0 20px 20px 20px;
}

.vidcontitle{
color: #c30808;
font-size: larger; 
margin: 0; 
padding:20px 20px 0 20px;
}

/*1.フェードインアニメーションの指定*/
.scrollanime {opacity: 0;} /*一瞬表示されるのを防ぐ*/
.fadeInDown {
    animation-name: fadeInDown;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}
@keyframes fadeInDown {
    0% {
        opacity: 0;         
    }
    100% {
    opacity: 1;
    transform: translate(0);
    }
}

.fadeOutDown {
    animation-name: fadeOutDown;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}
@keyframes fadeOutDown {
    0% {
	opacity: 1;
	transform: translate(0);       
    }
    100% {
    opacity: 0;
    }
}
 
/*2.上下の動きを指定*/
.updown {transform: translateY(-90px);}
.downup {transform: translateY(90px);}
 
/*3.左右の動きを指定*/
.sect02{overflow: hidden;} /*横スクロールバーを隠す*/
.slide-right {transform: translateX(200px);}
.slide-left {transform: translateX(-200px);}

.releas-timing{
	margin-top:160px;
	}

.kosei-banner{
	width: 70%;
	margin: 20px auto;
}


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

    ul.spec li{
	font-size: 12px;
	}

	.produt_ttl2 {
	font-size: 14px;
	}

	.sec_vid_con {
	margin: 10px 0 90px 0;
    padding: 20px 0;
    background: #050505;
	}	

	.sec_vid_con video{
		width: 100%;
	}

	.vidcontext{
	font-size: x-small;
	padding: 0 10px 10px 10px;
	}

	.releas-timing{
	margin-top:55px;
	}

	.kosei-banner{
	width: 100%;
	margin: 20px auto;
	}

	.vidcontitle{
    font-size: smaller; 
	margin: 0; 
	padding:10px 10px 0 10px;
	}

	.top_topics{
		padding: 40px 0 50px 0;
	}

	.top_contents {
		margin: 0px auto !important;
	}

	.section .news_main .news_more{
	display: none;
	}


	.updown {transform: translateY(-50px);}
    .downup {transform: translateY(50px);}

	.top_yt{
	padding: 0 0 80px 0 !important;
	}

	.sec_vid_con2{
		margin: 0px 0 90px 0 !important;
		padding: 20px 0 20px 0 !important;
		background-color: #000;
	}

	.slider2 .slick-slide {
		margin: 0 !important;
	}
}

.top_yt{
	padding: 60px 0;
}

.mypattern .slick-slide:not(.slick-center) {
	-webkit-transform: scale(0.8);
	-moz-transform: scale(0.8);
	-ms-transform: scale(0.8);
	-o-transform: scale(0.8);
	transform: scale(0.8);
	transition:all 0.5s;
	opacity: 0.5;
  }

.sec_vid_con2{
    margin: 50px 0 140px 0;
    /*background-color: #000;*/
    padding: 60px 0 20px 0;
}

.scptop_build{
    display: flex;
    align-items: center;
}

.scptop_build_width{
	width: 50%;
}

.scptop_build iframe{
    width: 100%;
	height: 290px;
}