@charset "UTF-8";
/* Reset ----------------------------- */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, img, strong, dl, dt, dd, ul, li, form, label, table, caption, tbody, tfoot, thead, tr, th, td, article, footer, header, menu, nav, section { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:top; background:transparent; }
body { line-height:1; font-family: meiryo, 'Meiryo W53 Regular', 'Hiragino Kaku Gothic ProN', sans-serif; -webkit-text-size-adjust:none; min-width:320px;}
article, footer, header, nav, section {	display:block; }
ul { list-style:none; }
a { margin:0; padding:0; border:0; font-size:100%; vertical-align:top; background:transparent; }
table { border-collapse:collapse; border-spacing:0; width:100%; }
hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:0; padding:0; }
input, select { vertical-align:middle; }
img { vertical-align:bottom; }
.cf:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; }

.left{text-align:left!important}.center{text-align:center!important}.right{text-align:right!important}.top{vertical-align:top!important}.middle{vertical-align:middle!important}.bottom{vertical-align:bottom!important}
.w5{width:5%!important}.w10{width:10%!important}.w15{width:15%!important}.w20{width:20%!important}.w25{width:25%!important}.w30{width:30%!important}.w35{width:35%!important}.w40{width:40%!important}.w45{width:45%!important}.w50{width:50%!important}.w55{width:55%!important}.w60{width:60%!important}.w65{width:65%!important}.w70{width:70%!important}.w75{width:75%!important}.w80{width:80%!important}.w85{width:85%!important}.w90{width:90%!important}.w95{width:95%!important}.w100{width:100%!important}

/* Layout ----------------------------- */
header { width:100%; height:75px; background-color:#fff;}
header h1 { float:left; margin-top:19px; }
header div { float:right; margin-top:16px; }
.maxWidth { margin:0 50px; }
.caution { display:none; }
body{ display:none;}

/*-- Key visual Top --*/
#top section#keyV {position:relative;width:100%;margin:0 auto;background-image: url(../img/bg_keyv.jpg);background-position:center center;background-size:cover;background-color:#000;height:500px;}
#top section#keyV .box{width:100%;max-width:1100px;margin:0 auto;display:table;height:500px;}
#top section#keyV h1{width:45%;display:table-cell;vertical-align:middle;}
#top section#keyV h1 img{width:84%;max-width:446px;padding:0 0 0 6%;}
#top section#keyV .txt{width:45%;display:table-cell;vertical-align:middle;}
#top section#keyV .txt p{color:#fff;font-size:15px;line-height:2;padding:0 10% 0 0;}

/*-- Key visual Other --*/
#cmn section#keyV {position:relative;width:100%;margin:0 auto;background-position:center center;background-size:cover;background-color:#000;height:300px;}
#cmn section#keyV .box{max-width:1100px;margin:0 auto;display:table;height:300px;}
#cmn section#keyV .box h1 img{ position:absolute;width:230px;top:24px;left:50px; opacity:.6;}
#cmn section#keyV .box h2.title{display:table-cell;vertical-align:middle; text-align:center;}
#cmn section#keyV .box h2.title img{width:100%;}
#cmn section#keyV .box .botline{width:100%; height:10px; position:absolute; background-color:#fff; opacity:.25;left:0; bottom:0;}
#cmn section#keyV .box img.numL{ position:absolute;right:25px;bottom:10px; display:block;}

#cmn.semiconductor section#keyV {background-image: url(../img/bg_kyv_semiconductor.jpg);}
#cmn.ic section#keyV {background-image: url(../img/bg_kyv_ic.jpg);}
#cmn.binarynumber section#keyV {background-image: url(../img/bg_kyv_binary-number.jpg);}
#cmn.microprocessor section#keyV {background-image: url(../img/bg_kyv_microprocessor.jpg);}
#cmn.memory section#keyV {background-image: url(../img/bg_kyv_memory.jpg);}
#cmn.liquidcrystal section#keyV {background-image: url(../img/bg_kyv_liquid-crystal.jpg);}
#cmn.cmos section#keyV {background-image: url(../img/bg_kyv_cmos.jpg);}
#cmn.led section#keyV {background-image: url(../img/bg_kyv_led.jpg);}

section#main{width:100%;background-color:#fff; padding:30px 0 60px;} 
section#main #content{position:relative;padding:0 30px;max-width:1100px;margin:0 auto;}

#top section#main{width:100%;background-color:#fff; padding:30px 0;} 
#top section#main #content{overflow:hidden;padding:0 30px;max-width:1100px;margin:0 auto;}

#cmn section#main{width:100%;background-color:#fff; padding:30px 0 30px;} 

#content a{text-decoration:none;}
#content a:hover .principleList{opacity:.8;-webkit-transition: 0.25s ease-in-out;-moz-transition: 0.25s ease-in-out;-o-transition: 0.25s ease-in-out;transition: 0.25s ease-in-out;}

#top #content ul li.btn{float:left;width:32%;margin:0 2% 25px 0;}
#top #content ul li:nth-child(3).btn,#top #content ul li:nth-child(6).btn{margin:0 0 25px 0 !important;}

.principleList{position:relative;min-height:auto;overflow:hidden;}
.principleList .hdg_img img {width:100%;}
.principleList h2 {position:relative;color:#fff;width:100%;padding:15px 20px;box-sizing:border-box; z-index:99;}
.principleList h2 p {font-size:20px;font-weight:600; margin:0;line-height:1.3;}
.principleList h2 ul{margin:10px 0 0 0;padding: 0 0 45px 20px;list-style-type: disc;}
.principleList h2 ul li{font-size:13px;font-weight:normal;padding:7px 10px 0 0;line-height:1.3;}
.principleList .hdg_num1 { position:absolute; right:0; bottom:0; z-index:1; text-align:right;}
.principleList .hdg_num2 { position:absolute; right:-7px; bottom:0; z-index:1; text-align:right;}
.principleList .hdg_num3 { position:absolute; right:-11px; bottom:0; z-index:1; text-align:right;}
.principleList .hdg_num4 { position:absolute; right:-2px; bottom:0; z-index:1; text-align:right;}
.principleList .hdg_num5 { position:absolute; right:-11px; bottom:0; z-index:1; text-align:right;}
.principleList .hdg_num6 { position:absolute; right:-5px; bottom:0; z-index:1; text-align:right;}
.principleList .hdg_num7 { position:absolute; right:-5px; bottom:0; z-index:1; text-align:right;}
.principleList .hdg_num8 { position:absolute; right:-10px; bottom:0; z-index:1; text-align:right;}

.color1{background:#205693 url(../img/underline01.png) bottom left repeat-x;}
.color2{background:#827e1e url(../img/underline02.png) bottom left repeat-x;}
.color3{background:#277f9a url(../img/underline03.png) bottom left repeat-x;}
.color4{background:#41478d url(../img/underline04.png) bottom left repeat-x;}
.color5{background:#196952 url(../img/underline05.png) bottom left repeat-x;}
.color6{background:#1a3786 url(../img/underline06.png) bottom left repeat-x;}
.color7{background:#5e1e6e url(../img/underline07.png) bottom left repeat-x;}
.color8{background:#5f5f5f url(../img/underline08.png) bottom left repeat-x;}

/*--- Contents ---*/
.panelContent{padding:30px 30px 0;}
.panelContent .headline{background-color:#ebebeb;border-left:5px solid #054171;margin:0 0 40px 0;}
.panelContent h2{color:#333;padding:12px 20px 10px;font-size:22px;font-weight:600;}
.panelContent .col p{color:#333;font-size:15px;line-height:1.8;}
.panelContent>.mediaLayout{margin-bottom:60px;}
.panelContent>.mediaLayout:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; }

.mediaLayout[data-media-layout*=parallel]>.media,.mediaLayout[data-media-layout*=parallel]>.media2{margin-bottom:0}
.mediaLayout[data-media-layout*=left]>.media,.mediaLayout[data-media-layout*=left]>.media2{float:left;margin-right:8%}
.mediaLayout[data-media-layout*=right]>.media,.mediaLayout[data-media-layout*=right]>.media2{float:right;margin-left:8%}
.mediaLayout[data-media-layout*=parallel]>.col{overflow:hidden;}

.mediaLayout>.media{width:460px; height:350px; background-color:#fff; overflow:hidden;}
.mediaLayout>.media2{background-color:#fff;}

.mediaLayout>.media iframe.pc{display:block; background-color:#151515;}
.mediaLayout>.media iframe.sp{display:none; background-color:#151515;}

.semiconductor .mediaLayout>.media iframe._pc1{margin:50px auto 0;}
.semiconductor .mediaLayout>.media iframe._pc2{margin:15px auto 0;}
.semiconductor .mediaLayout>.media iframe._pc3{margin:10px auto 0;}
.semiconductor .mediaLayout>.media iframe._pc4{margin:5px auto 0;}

.ic .mediaLayout>.media iframe._pc1{margin:25px auto 0;}
.ic .mediaLayout>.media iframe._pc2{margin:15px auto 0;}
.ic .mediaLayout>.media iframe._pc3{margin:20px auto 0;}

.binarynumber .mediaLayout>.media iframe._pc1{margin:30px auto 0;}
.binarynumber .mediaLayout>.media iframe._pc2{margin:10px auto 0;}
.binarynumber .mediaLayout>.media iframe._pc3{margin:15px auto 0;}

.microprocessor .mediaLayout>.media iframe._pc1{margin:20px auto 0;}

.memory .mediaLayout>.media iframe._pc1{margin:20px auto 0;}

.liquidcrystal .mediaLayout>.media iframe._pc1{margin:0 auto 0;}
.liquidcrystal .mediaLayout>.media iframe._pc2{margin:5px auto 0;}
.liquidcrystal .mediaLayout>.media iframe._pc3{margin:10px auto 0;}

.cmos .mediaLayout>.media iframe._pc1{margin:10px auto 0;}

.led .mediaLayout>.media iframe._pc1{margin:10px auto 0;}

sup.notice{margin-right:6px;color:#0085da;}
.sctlink{color:#0085da !important;}
.sctbox {margin:20px 0 0; padding-bottom:5px; font-size:90%;}
.sctbox dl { display:table;}
.sctbox dt { display:table-cell;clear:both; float:left; padding:0 4px 0 0; color:#0085da; line-height:1.5;}
.sctbox dd { display:table-cell;padding:0 0 0 .2em; vertical-align:top; line-height:1.5;}

/*--- Footer Index ---*/
section#fIndex{background-color:#eee;width:100%;padding:30px 0 20px;}
section#fIndex .area{position:relative;padding:0 30px;max-width:1100px;margin:0 auto;}
section#fIndex .area .block{padding:10px 30px 0;}
section#fIndex .area .title{margin:0 0 30px 0; border-bottom:1px solid #bdbdbd; }
section#fIndex .area .title img{display:block;}
section#fIndex .area ul{overflow:hidden; margin:0 0 20px 0;}
section#fIndex .area li{float:left; margin:0 2.4% 20px 0; width:23.2%; }
section#fIndex .area li.no{margin:0 !important;}
section#fIndex .area li img.fpic{display:block;width:100%; vertical-align:top;}
section#fIndex .area li .txt{ position:relative; display:table; width:100%; height:80px;}
section#fIndex .area li .txt p{color:#fff; font-size:.9rem; font-weight:700; vertical-align:middle;display: table-cell; padding:0 50px 0 15px; line-height:1.4;}
section#fIndex .area li .txt img.fnum { position:absolute; right:0; bottom:3px; width:14%;}
section#fIndex .area a{ text-decoration:none;}

#cmn.semiconductor section#fIndex .area li:nth-child(1),#cmn.ic section#fIndex .area li:nth-child(2),#cmn.binarynumber section#fIndex .area li:nth-child(3),#cmn.microprocessor section#fIndex .area li:nth-child(4),#cmn.memory section#fIndex .area li:nth-child(5),#cmn.liquidcrystal section#fIndex .area li:nth-child(6),#cmn.cmos section#fIndex .area li:nth-child(7),#cmn.led section#fIndex .area li:nth-child(8){opacity:.35;}

/*--- Footer ---*/
footer { width:100%; padding: 15px 0 30px; background-color:#fff; overflow:hidden;}
footer p { font-size:13px; line-height:120%; font-weight:normal; color:#999; float:left; }
footer a { color:#999;}
footer a:hover { text-decoration:none;}
footer small { font-size:13px; line-height:120%; font-weight:normal; color:#999; float:right; }

/* Tablet ----------------------------------------------------------*/
@media only screen and (max-width:979px){
#top #content ul li.btn{float:left;width:48.5%;margin:0 3% 25px 0;}
#top #content ul li:nth-child(3).btn{margin:0 3% 25px 0 !important;}
#top #content ul li:nth-child(2).btn,#top #content ul li:nth-child(4).btn,#top #content ul li:nth-child(6).btn,#top #content ul li:nth-child(8).btn{margin:0 0 25px 0 !important;}

#cmn section#keyV {position:relative;width:100%;margin:0 auto;background-position:center center;background-size:cover;background-color:#000;height:260px;}
#cmn section#keyV .box{margin:0 auto;display:table;height:260px;}
#cmn section#keyV .box h1 img{ position:absolute;width:200px;top:12px;left:30px; opacity:.6;}
#cmn section#keyV .box img.numL{width:80px;position:absolute;right:25px;bottom:10px; display:block;}

section#main #content{position:relative;padding:0 10px;max-width:1100px;margin:0 auto;}

#content a:hover .principleList{opacity:1 !important;}

.mediaLayout{display:table;width:100%;}
.mediaLayout>.col{display:table-header-group;}

.mediaLayout[data-media-layout*=left]>.media,.mediaLayout[data-media-layout*=left]>.media2{float:none;margin-right:0;}
.mediaLayout[data-media-layout*=right]>.media,.mediaLayout[data-media-layout*=right]>.media2{float:none;margin-left:0;}
.mediaLayout>.media{margin-top:50px;width:100%;}
.mediaLayout>.media2{width:100%; margin:50px auto; text-align:center;}
.mediaLayout>.media2 img{width:100%;}

.mediaLayout>.media iframe{display:block;margin:0 auto;}

section#fIndex .area{position:relative;padding:0 10px;max-width:1100px;margin:0 auto;}
section#fIndex .area .title img{display:block; width:100px;}
section#fIndex .area li .txt p{color:#fff; font-size:.8rem; font-weight:700; vertical-align:middle;display: table-cell; padding:0 15px 0 10px; line-height:1.4;}

footer p { float:none; text-align:center; margin:0 0 15px 0;}
footer small {display:block; float:none; text-align:center; }
}

/* Phone ----------------------------------------------------------*/
@media only screen and (max-width:767px){
.maxWidth { margin:0 15px !important;}
header h1 img,header div img { width:88%;}

#top section#keyV{
	height: calc(100% - 75px);
	position: relative;
	display: table;
	overflow: hidden;
}

#top section#keyV .box{
	max-height: 100%;
	margin: 0 auto;
	display: table-cell;
	vertical-align: middle;
	height: auto;
	padding: 0 10%;
}

#top section#keyV h1{width:100%;display:block; text-align:left;margin-bottom: 10px;}
#top section#keyV h1 img{width:84%;padding:0;
/* 	margin:40px auto 30px; */
	}
#top section#keyV .txt{
	width: calc(100% - 24px);
	display:block;
	margin:0 auto;
	font-size: 1rem;
	line-height: 1.4;
	padding: 0 12px;
}
	
#top section#keyV .txt p{
	color:#fff;
	font-size: 12px;
	line-height: 1.4;
	padding:0;
	}

#top section#main #content{padding:0 20px;}

#cmn section#keyV {position:relative;width:100%;margin:0 auto;background-position:center center;background-size:cover;background-color:#000;height:240px;}
#cmn section#keyV .box{margin:0 auto;display:table;height:240px;}
#cmn section#keyV .box h2.title img{width:75%;}
#cmn section#keyV .box h1 img{ position:absolute;width:180px;top:10px;left:15px; opacity:.6;}
#cmn section#keyV .box img.numL{width:50px;position:absolute;right:25px;bottom:10px; display:block;}

#content a:hover .principleList{ opacity:1 !important;}

.principleList h2 {position:relative;color:#fff;width:100%;padding:35px 20px;box-sizing:border-box; z-index:99;}
.principleList h2 p {font-size:17px;font-weight:600; margin:0;line-height:1.3;}
.principleList h2 ul{display:none;}

.principleList .hdg_num1 {right:0; bottom:3px;}
.principleList .hdg_num2 {right:-4px; bottom:3px;}
.principleList .hdg_num3 {right:-6px; bottom:3px;}
.principleList .hdg_num4 {right:-1px; bottom:3px;}
.principleList .hdg_num5 {right:-6px; bottom:3px;}
.principleList .hdg_num6 {right:-2px; bottom:3px;}
.principleList .hdg_num7 {right:-3px; bottom:3px;}
.principleList .hdg_num8 {right:-6px; bottom:3px;}

.principleList .hdg_num1 img,.principleList .hdg_num2 img,.principleList .hdg_num3 img,.principleList .hdg_num4 img,.principleList .hdg_num5 img,.principleList .hdg_num6 img,.principleList .hdg_num7 img,.principleList .hdg_num8 img{width:60%;}

.panelContent{padding:10px 10px 0;}
.panelContent>.mediaLayout{padding-bottom:0 !important;margin-bottom:50px;}
.panelContent .headline{background-color:#ebebeb;border-left:5px solid #054171;margin:0 0 20px 0;}
.panelContent h2{color:#333;padding:12px 15px 10px;font-size:18px;font-weight:600;}

.mediaLayout[data-media-layout*=left]>.media,.mediaLayout[data-media-layout*=left]>.media2{float:none;margin-right:0;}
.mediaLayout[data-media-layout*=right]>.media,.mediaLayout[data-media-layout*=right]>.media2{float:none;margin-left:0;}
.mediaLayout>.media{margin-top:30px;width:100%; height:250px;}
.mediaLayout>.media2{width:100%; margin:30px auto; text-align:center;}
.mediaLayout>.media2 img{width:100%;}

.mediaLayout>.media iframe.pc{width:100%; display:none;}
.mediaLayout>.media iframe.sp{width:100%; display:block;}

.semiconductor .mediaLayout>.media iframe._sp1{margin:40px auto 0;}
.semiconductor .mediaLayout>.media iframe._sp2{margin:15px auto 0;}
.semiconductor .mediaLayout>.media iframe._sp3{margin:10px auto 0;}
.semiconductor .mediaLayout>.media iframe._sp4{margin:5px auto 0;}

.ic .mediaLayout>.media iframe._sp1{margin:20px auto 0;}
.ic .mediaLayout>.media iframe._sp2{margin:12px auto 0;}
.ic .mediaLayout>.media iframe._sp3{margin:20px auto 0;}

.binarynumber .mediaLayout>.media iframe._sp1{margin:30px auto 0;}
.binarynumber .mediaLayout>.media iframe._sp2{margin:10px auto 0;}
.binarynumber .mediaLayout>.media iframe._sp3{margin:15px auto 0;}

.microprocessor .mediaLayout>.media iframe._sp1{margin:15px auto 0;}

.memory .mediaLayout>.media iframe._sp1{margin:20px auto 0;}

.liquidcrystal .mediaLayout>.media iframe._sp1{margin:0 auto 0;}
.liquidcrystal .mediaLayout>.media iframe._sp2{margin:5px auto 0;}
.liquidcrystal .mediaLayout>.media iframe._sp3{margin:10px auto 0;}

.cmos .mediaLayout>.media iframe._sp1{margin:10px auto 0;}

.led .mediaLayout>.media iframe._sp1{margin:10px auto 0;}

section#fIndex{background-color:#eee;width:100%;padding:20px 0 20px;}
section#fIndex .area{position:relative;padding:0 10px;max-width:1100px;margin:0 auto;}
section#fIndex .area .block{padding:10px 10px 0;}
section#fIndex .area .title{margin:0 0 20px 0; border-bottom:1px solid #bdbdbd; }
section#fIndex .area ul{overflow:hidden; margin:0;}
section#fIndex .area li{float:left;width:48.5%;}
section#fIndex .area li:nth-child(2n+1){margin:0 3% 15px 0;}
section#fIndex .area li:nth-child(2n){margin:0 0 15px 0;}
section#fIndex .area li .txt{ position:relative; display:table; width:100%; height:70px;}
section#fIndex .area li .txt p{color:#fff; font-size:.8rem; font-weight:700; vertical-align:middle;display: table-cell; padding:0 12px; line-height:1.4;}
section#fIndex .area li .txt img.fnum { position:absolute; right:0; bottom:3px; width:12%;}

footer { width:100%; padding: 15px 0 30px; background-color:#000; overflow:hidden;}
footer p { font-size:13px; line-height:140%; font-weight:normal; color:#999; float:none; }
footer a { color:#999;}
footer a:hover { text-decoration:underline;}
footer small { font-size:13px; line-height:140%; font-weight:normal; color:#999; float:none; }
}

@media screen and (max-width:767px) and (orientation: portrait){
	
	#top section#keyV{
	height: calc(100% - 139px);
	}
	
	#top section#keyV h1 img{
		width: 100%;
	}
	
	#top section#keyV .box{
		padding: 15px 10px;
	}
	
	#top section#keyV .txt p{
		font-size: 13px;
		line-height: 1.8;
	}

	#top #content ul li:nth-child(1).btn,#top #content ul li:nth-child(2).btn,#top #content ul li:nth-child(3).btn,#top #content ul li:nth-child(4).btn,#top #content ul li:nth-child(5).btn,#top #content ul li:nth-child(6).btn,#top #content ul li:nth-child(7).btn,#top #content ul li:nth-child(8).btn{float:none !important;width:100% !important;margin:0 0 15px 0 !important;}

}