/*
Theme Name: A1-001
Author: クオリティWebデザイン
Author URI: https://web.1os.co.jp/
*/
/********** Header **********/
#header{background:rgba(0,16,64,.9);height:50px;box-shadow:0 1px 3px rgba(0,0,0,.3);border-bottom:1px solid rgba(255,255,255,0)}
#home #header{background:none;box-shadow:none;height:100vh}
#logo{font-size:1.5em}
#home #logo{font-size:1.9em}
.others #logo{margin-right:auto}
#mainContent{padding-top:50px}
#home #mainContent{padding:0}
#slideProf{width:30%}
.others #slideProf{display:none}
#slideProfImg{width:100%;max-width:192px}
@media all and (min-width:992px) , print {
	#header{height:50px;box-shadow:none}
	#home #header{height:100vh;position:absolute}
	#home #headerMain{width:auto!important;max-width:100%!important;height:auto;display:inline!important;position:absolute;bottom:50px;right:50px}
	#home #logo{font-size:2.4em}
	#slideProf{width:172px}
}
	#logo a{
		color:#fff!important;
	}


/********** Contents **********/
.titleH2,.titleH3{margin:1.5em 0}
.container p{margin:.8em 0}
.container ul{padding:0;margin:.8em 0 .8em 1.6em}
.container ol{padding:0;margin:.8em 0 .8em 2.4em}
#slideName{z-index:100;top:0;left:0;width:100vw;height:100vh}
#gMapArea:before{content:"";display:block;padding-top:56.25%}
#gMapArea iframe{position:absolute;top:0;left:0;bottom:0;right:0;width:100%;height:100%}
.titleH2,.titleH3{
	line-height:1.2;
}
#pageTitle h1 {
  position: relative;
  padding: .5em .75em;
  background-color: #f6f6f6;
}
#pageTitle h1::before,
#pageTitle h1::after {
  position: absolute;
  bottom: 8px;
  z-index: -1;
  content: '';
  width: 30%;
  height: 50%;
  box-shadow: 0 10px 15px rgba(0, 0, 0, .2);
}
#pageTitle h1::before {
  -webkit-transform: rotate(-3deg);
  transform: rotate(-3deg);
  left: .3em;
}
#pageTitle h1::after {
  -webkit-transform: rotate(3deg);
  transform: rotate(3deg);
  right: .3em;
}
.topicCat {min-width:5em}
.bg-img{background-repeat:no-repeat;background-position:50% 0;background-size:100% auto}
.bg-img-A{background-image:url(/wp-content/uploads/IMG_4582.jpg)}
.bg-img-B{background-image:url(/wp-content/uploads/IMG_4581.jpg)}
.bg-img-C{background-image:url(/wp-content/uploads/rf89059433_l.jpg)}
.bg-img-D{background-image:url(/wp-content/uploads/図抽象的な未来波デジタル-テクノロジー概念のベクトルの背景.jpg)}
.bg-img-E{background-image:url(/wp-content/uploads/IMG_4578.jpg)}
.bg-img-F{background-image:url(/wp-content/uploads/px0010084875o.jpg)}
.bg-img-G{background-image:url(/wp-content/uploads/rf138035066_l.jpg)}
.bg-img-H{background-position:0 0%;background-image:url(/wp-content/uploads/rf40209623_o.jpg)}
.bg-A{z-index:2;margin-top:13em}
.bg-img-H .bg-A{margin-top:9em}
.youtube::before {
content:"";
display:block;
padding-top:56.25%;
}
.youtubeIcon {
	left:50%;
	top:50%;
	z-index:2;
	opacity:.8;
	font-size:48px;
	margin:-24px 0 0 -18px;
	color:#fff;
	text-shadow:0 0 4px rgba(0,0,0,.6)
}
.youtubeThumb {
  position: absolute;
	z-index:1;
  top: .4em;
  left: .4em;
  width:calc(100% - .4em) !important;
  height:calc(100% - .4em) !important;
}
@media all and (min-width:576px) , print {
}
@media all and (min-width:768px) , print {
.bg-img{background-repeat:no-repeat;background-size: 50% auto;padding:7em 0}
.bg-img:after {
  content: "";
  display: block;
  position: absolute;
  width: 50%;
  height: 100%;
  bottom: 0;
	z-index:1;
}
.bg-img-A,.bg-img-E,.bg-img-G{background-position:0 50%;background-color:#f0f0f0}
.bg-img-B,.bg-img-D{background-position:100% 50%;background-color:#fff}
.bg-img-C{background-position:0 50%;background-color:#EAF8FF}
.bg-img-F{background-position:100% 50%;background-color:#EAF8FF}
.bg-img-A:after,.bg-img-E:after,.bg-img-G:after{
  background: linear-gradient(to right,transparent, #f0f0f0); 
}
.bg-img-B:after,.bg-img-D:after{
	left:50%;
  background: linear-gradient(to left,transparent, #fff); 
}
.bg-img-C:after{
  background: linear-gradient(to right,transparent, #EAF8FF); 
}
.bg-img-F:after{
	left:50%;
  background: linear-gradient(to left,transparent, #EAF8FF); 
}
.bg-img-H:after{
	left:50%;
	background: linear-gradient(to left,transparent, #F1F6F7); 
}
.bg-A{margin-top:0;margin-bottom:0}
.bg-img-H{padding:8em 0;background-position:100% 0;background-color:#F1F6F7}
.bg-img-H .bg-A{margin:0}
.topic-date,.topic-title, .topic-cats{width:auto}
.topic-date{flex:0 0 auto}
#homeTopic .titleH2,#homeTopic .titleH2>span{border:none;padding:0;margin:0;background:none}
}
@media all and (min-width:992px) , print {
#slideName{padding-left:40px}
}
