@charset "utf-8";

/* for 1600px or less */ 
@media screen and (max-width: 1600px) {
#product-carousel .item .thumb img	{ border:10px solid #000; }
#item-preview-images img			{ border:10px solid #000; }
}

/* for 1440px or less */ 
@media screen and (max-width: 1440px) {
	
#hero-box .title					{ font-size:2.8em; }
#hero-box .watch-video 				{ margin-top:20px; }
	
#product-section					{ padding:100px 0; }
#product-carousel .carousel-cell 	{ width:33.33333333%; }
	
}

/* for 1280px or less */ 
@media screen and (max-width: 1280px) {
	
#main-inner							{ padding:40px 0; }
.section 							{ padding:80px 0; }

#product-section					{ padding:80px 0; }

#contact-section					{ padding-top:60px; }

#usecase-section					{ padding-top:40px; }
#usecase-album						{ margin-top:40px; }

#item-detail						{ padding:80px 0; }
#item-preview-images img			{ border:8px solid #000; }
}

/* for 1024px or less */ 
@media screen and (max-width: 1024px) {

h2			{ font-size:2.2em; line-height:1.15em; }
h3			{ font-size:1.6em; }
h4			{ font-size:1.12em; }
	
.section 							{ padding:60px 0; }

#product-section					{ padding:70px 0; }
#product-carousel .item .thumb img	{ border:8px solid #000; }

#contact-section h2					{ margin-bottom:30px; }
#contact-form p						{ margin-bottom:10px; }
#contact-form textarea				{ height:162px; }	
 

#item-banner						{ padding-top:40%; }	
}

/* for 920px or less */ 
@media screen and (max-width: 920px) {
	
.flickity-prev-next-button			{ width:40px; height:40px; }	

.section-content					{ float:none; width:auto; }
.section-content h2					{ margin-bottom:40px; text-align:center; }
.section-content h2 br				{ }
.section-paragraph					{ margin-bottom:40px; width:48%; margin-right:4%; float:left; }
.section-paragraph:nth-child(2n)	{ margin-right:0; }
.section-paragraph h3				{ margin-bottom:10px; }
.section-paragraph .desc 			{ font-size:1.1em; }
.section-aside						{ position:static; margin-top:50px; }
.section-aside.static				{ margin-left:0; }
.section-aside .diagram				{ position:static; transform:none; display:block; margin:auto; }

.section.reverse .section-content  	{ float:none; }
.section.reverse .section-aside		{ }

.cta-link							{ text-align:center; }
	
#hero-box .title br					{ display:none; }

#product-carousel .carousel-cell 	{ width:40%; }

#usecase li							{ width:50%; margin-bottom:30px; }
#usecase li:first-child:before		{ display:block; }
#usecase img						{ margin-bottom:10px; width:60px; }
#usecase h4							{ margin-bottom:10px; }
#usecase-album						{ margin-top:10px; }

#cooperation-case					{ margin-bottom:20px; overflow:hidden; zoom:1; }
#cooperation-case li				{ margin-bottom:30px; padding:0 2%; }
#cooperation-case li img			{ width:60px; float:none; margin-bottom:15px; }
#cooperation-case li.has-icon		{ width:33.333333%; float:left; }
#cooperation-case li.has-icon h4	{ margin-left:0; margin-bottom:15px; }
#cooperation-case li.has-icon p		{ margin-left:0; }
#cooperation-section .cta-link		{ position:static; }

#contact-section					{ padding-top:50px; }


#item-banner						{ padding-top:50%; }
#item-detail						{ padding:40px 0; }
#item-info							{ width:auto; float:none; overflow:hidden; zoom:1; margin-bottom:30px; }
#item-info .desc					{ width:60%; float:left; }
#item-info .spec					{ margin-left:70%; }
#item-info .button					{ margin-left:10%; }
#item-preview						{ width:auto; float:none; }
#item-preview-images				{ padding-top:60%; }
}

/* for 767px or less */ 
@media screen and (max-width: 767px) {
	
h2										{ font-size:2em; }

#header-wrapper							{ height:64px; }
#header-inner h1						{ width:114px; height:24px; margin:21px auto 0 auto; }
#header-inner nav						{ font-size:.96em; }
#header-inner .lang						{ font-size:.96em; }
																						
#main-wrapper							{ padding-top:64px; }
#main-inner								{ padding:0 0; }
.section 								{ padding:40px 0; }
.section-content h2						{ margin-bottom:30px; text-align:left; }
.section-paragraph						{ margin-bottom:30px; width:100%; margin-right:0; float:none; }
.section-aside							{ margin-top:40px; }
.section-aside .diagram					{ width:90%; }
.cta-link								{ text-align:left; font-size:1.05em; }

#footer-wrapper							{ padding:20px 0; }

#hero-box .title						{ font-size:2.4em; line-height:1.1em; }

#product-section						{ padding:50px 0 40px 0; }
#product-carousel .carousel-cell 		{ width:80%; }
#product-carousel .item .thumb img		{ border:6px solid #000; }

#usecase li								{ width:100%; margin-bottom:30px; float:none; padding:0 1.5%; overflow:hidden; zoom:1; }
#usecase li:before						{ display:none !important; }
#usecase img							{ margin-bottom:0; width:48px; float:left; }
#usecase h4								{ margin-left:68px; margin-bottom:5px; }
#usecase p								{ margin-left:68px; }
#usecase-album .carousel-cell			{ padding-top:75%; }

#cooperation-section h2					{ font-size:2em; }

#cooperation-case li					{ width:100% !important; float:none; }
#cooperation-case li img				{ width:48px; float:left; }
#cooperation-case li.has-icon h4		{ margin-left:68px; margin-bottom:5px; }
#cooperation-case li.has-icon p			{ margin-left:68px; }


#contact-section						{ padding-top:30px; }
#contact-form .group-lt					{ float:none; width:auto; }
#contact-form .group-rt					{ float:none; width:auto;  }


#item-banner							{ padding-top:68%; }
#item-detail							{ padding:30px 0; }
#item-info .desc						{ width:auto; float:none; }
#item-info .spec						{ margin-left:0; }
#item-info .button-wrapper				{ text-align:center; }
#item-info .button						{ margin-left:0; }
#item-preview							{ margin-top:50px; }
#item-preview-images					{ padding-top:100%; }
#item-preview-images img				{ border:6px solid #000; }

#news-list li							{ width:auto; float:none; margin-right:0; margin-bottom:40px; }
#news-list .thumb						{ margin-bottom:15px; }
#news-list .date						{ margin-bottom:12px; }
#news-list .title						{ margin-bottom:10px; }
#news-list .summary						{ margin-bottom:15px; }

.article-images							{ margin-bottom:30px; }
.article-images .holder					{ padding-top:72%; }
.article .back							{ margin-bottom:12px; }	
.article .date							{ margin-bottom:10px; }
.article .title							{ margin-bottom:20px; font-size:1.6em; }
	
}

/* for 360px or less */ 
@media screen and (max-width: 360px) {

.play-button							{ width:64px; height:64px; }
											
#header-wrapper							{ height:48px; }
#header-inner h1						{ width:95px; height:20px; margin:14px auto 0 auto; }
#header-inner nav						{ font-size:12px; }
#header-inner .lang						{ font-size:12px; }							
#main-wrapper							{ padding-top:48px; }

#hero-box .title						{ font-size:2.2em; }
}