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

@media screen and (min-width: 500px) {
	.nav-option { letter-spacing: 3px; font-size:16px; padding: 40px 0 15px; }
}

/****** Min-width: 768px ******/
@media screen and (min-width: 768px) {
	
	.navbar-nav>li { width: inherit; margin: 0 15px; }
	#filter-menu1 { background-position: 8px center; }
	#filter-menu2 { background-position: 8px center; }
	#filter-menu3 { background-position: 8px center; }
	#filter-menu4 { background-position: 8px center; }
	.nav-option { padding: 25px 10px 25px 40px; }
	
	div.page-main { padding: 50px 0; }
	
	
	div.iprimo-logo img { width:30%; padding:25px 0; }
	div.mv-content { padding:0 15px; }
	div.article-content { min-height:200px; }
	div.mv-content { width:100%; max-width:320px; padding:0 15px; position: absolute; right:6%; top: 60px; }
	#header-visual { background: url(../images/mv-1920.jpg); background-repeat: no-repeat; background-position: 30% top; min-height:600px; padding: 0; }
	/*================== Start Common Setting ==================*/
	body.noscroll{ overflow: auto; }
	

a:focus, a:hover {
color: #a96b6b;
text-decoration: underline;}


.left-box{float: left;
    width: 40%;}
.right-box{float: right;
    width: 60%;
}
.mv-title img{max-width: 384px;width: 100%;}
.left-box img{max-width: 548px; width: 100%;}
	
	.mv-ring img {max-width: 548px; width: 100%;}
	.mv-title { padding-top: 7%; width: 100%; max-width: 384px; }
	
	.headline{
    width: 70%;
    font-size: 17px;
    color: #7d7d7d;
    text-align: left;
    letter-spacing: 3px;
	line-height: 30px;
	 float: left;
	 padding-top: 2%;}
	

	
	.article-content { width: 100%; padding: 3%;  background: rgba(212, 164, 164, 0.8);overflow: hidden; }
	

	
	.logo {    width: 133px;
    height: 77px;
    position: absolute;
    top: 22px;
    left: 40px;}
	.navbar-default { background-color: #ffffff;}
	div.page-header { margin-top: 0px; }
	div.page-navbar {  }
	.navbar-custom  { border-radius: 0px; border: none; }
	.navbar-custom .container-fluid { padding: 0px; }
	.navbar-custom .container-fluid .navbar-collapse { padding: 0px; }
	div.navbar-header { display: none; }
	#page-navmenu {  position: relative; z-index: 0; width: 100%; height: 100%; background: none; }
	#page-navmenu ul.navbar-nav { width: 100%; background-color: #fff;font-size: 20px; }
	#page-navmenu ul.navbar-nav li { width: 25%; }
	#page-navmenu ul.navbar-nav li .nav-option { width: 96%; display: inline-block; vertical-align: middle; cursor: pointer; }
	#page-navmenu ul.navbar-nav li .nav-option p { margin: 0px auto; padding: 10px 0px; }
	#page-navmenu ul.navbar-nav li:nth-child(n+2):before { content: "|"; display: inline-block; vertical-align: middle; color: #d4a4a4; }
	#page-navmenu ul.navbar-nav li.active { background: transparent; }
	#page-navmenu ul.navbar-nav li.active p {    border-bottom: 4px solid #d4a4a4;max-width: 40px;}
	.screen-overlay { display: none; }
	
	div.article-block { margin: 3% auto; }
	div.article-block { width: 48%; float: left; margin: 1%; }
	
	.article-block-newtag{
		padding: 34px;
		font-size: 15px;
		letter-spacing: 2px;
		line-height: 25px;
		color: #666464;
		background-color: #fff;
		border: 1px solid #e1e1e1;
		width: 48%;
		float: left;
		margin: 1%;
	}

	.article-left-block-newtag{
		width: 40%;
		float:left;
	}

	.article-thumb-newtag img{
		width:80%;
	}

	.article-right-block-newtag {
		width: 60%;
		text-align: left;
		float: right;
	}
	.article-text-subject-newtag{
		font-family: 'Noto Serif TC', serif; 
		font-weight:600; 
		font-size: 20px; 
		color: #333333; 
		letter-spacing:3px;
	}
	
	/*================== End Common Setting ==================*/
	
	/* Handle the non-mobile nav bar*/
	#mobile-page-navbar{}	
	
}
/****** End Min-width: 768px ******/

/****** Min-width: 960px ******/

/****** End Min-width: 960px ******/


@media screen and (min-width: 992px) {
	
	div.article-block { width: 31%; float: left; margin: 1%; }
	.navbar-nav>li { margin: 0 30px; }
	div.mv-content { max-width:560px; right:1%; }
	#header-visual { background: url(../images/mv-1920.jpg); background-repeat: no-repeat; background-position: 40% top; min-height:600px; padding: 0; }
	div.article-content { min-height:225px; }
}


