@charset "utf-8";
/* CSS Document */
.page { background: #F4F4F4;}
#page-title { padding-top: 100px; width: 100%; height: 300px; background: url("../images/title.png") no-repeat center bottom; text-align: center; line-height: 200px;}
#page-title h2 { width: 98%; max-width: 1410px; margin: 0 auto; font-size: 40px; font-weight: bold; color: #fff; text-align: left;}

@media only screen and (max-width: 959px) {
    #page-title { padding-top: 60px; width: 100%; height: 200px; background: url("../images/title.png") no-repeat center top; background-size: cover; text-align: center; line-height: 140px;}
    #page-title h2 { font-size: 30px;}
}
@media only screen and (max-width: 640px) {
    #page-title { padding-top: 50px; width: 100%; height: 190px; background: url("../images/title.png") no-repeat center top; background-size: cover; text-align: center; line-height: 140px;}
}

h2.tit { position: relative; display: inline-block; width: 100%; margin:0 auto 50px auto; font-size:40px; text-align: center; color: #000; letter-spacing: 0.1em; line-height: 1.3;}
h2.tit:before { content: ''; position: absolute; top: -40px; display: inline-block; width: 60px; height: 1px; left: calc(50% - 30px); background-color:#0086C1; -webkit-transform: rotate(-90deg); transform: rotate(-90deg);}

@media only screen and (max-width: 640px) {
    h2.tit { font-size: 23px; margin-bottom:10px;}
    h2.tit:before { top: -30px; width: 40px; left: calc(50% - 20px);}
}

h2.tit2 { position: relative; display: inline-block; width: 100%; margin:0 auto 40px auto; font-size:32px; text-align: center; color: #000; letter-spacing: 0.1em; line-height: 1.3;}
h2.tit2:before { content: ''; position: absolute; top: -25px; display: inline-block; width: 34px; height: 1px; left: calc(50% - 17px); background-color:#0086C1; -webkit-transform: rotate(-90deg); transform: rotate(-90deg);}

@media only screen and (max-width: 640px) {
    h2.tit2 { font-size: 23px; margin-bottom:10px;}
    h2.tit2:before { top: -30px; width: 40px; left: calc(50% - 20px);}
}

.box { clear: both; width:94%; max-width:1400px; background:#fff; margin: 0 auto 60px auto; padding:50px; text-align:center; box-shadow: 0 0 11px rgba(153, 153, 153, 0.1); }

@media only screen and (max-width: 959px) {
    .box { padding:25px;}
}

.news-list { width: 100%; margin: 0 auto; padding: 85px 0 30px 0; background: #F4F4F4;}
.news-list .title { position: relative; display: inline-block; width: 100%; margin: 0 auto; font-size: 21px; text-align: center; color: #000; margin-bottom: 50px; letter-spacing: 0.1em; line-height: 1.3;}
.news-list .title span { font-size: 182%;}
.news-list .title:before { content: ''; position: absolute; top: -40px; display: inline-block; width: 60px; height: 1px; left: calc(50% - 30px); background-color:#0086C1; -webkit-transform: rotate(-90deg); transform: rotate(-90deg);}

.news-list .post { clear: both; width:100%; background: #fff; margin: 0 auto 10px auto; padding:30px; box-shadow: 0 0 11px rgba(153, 153, 153, 0.1);}
.news-list .post:after { content:" "; display:block; clear:both;}
.news-list .thumbnail { float: left; position: relative; width:30.2%; max-width:320px; height:180px; overflow: hidden;}
.news-list .thumbnail img { width:100%; height:100%; object-fit: cover; position: absolute; top: 0; left: 0;}
.news-list .entry-meta{ float: right; width: 66%; margin-bottom:30px;}
.news-list .cat { float: left; width:calc(100% - 90px); }
.news-list .cat a { float: left; width: 110px; height: 30px; margin-right: 5px; font-size: 14px; font-weight: bold; color: #fff; text-align: center; background: #00B0F0; line-height: 30px; display: block;}
.news-list .entry-date { float: right; width: 90px; padding:0; text-align: right; font-size: 13px; color: #002134; line-height: 30px;}
.news-list h2.entry-title { float: right; width: 66%; text-align: left; font-size: 21px;}
.news-list h2.entry-title a { text-decoration: none;}
.news-list h2.entry-title a:hover { text-decoration: underline;}

@media only screen and (max-width: 959px) {
    .news-list { padding: 85px 0 40px 0;}
    .news-list .thumbnail { height: 140px;}
    .news-list h2.entry-title { font-size: 18px;}
}

@media only screen and (max-width:640px) {
    .news-list .post { width: 100%; max-width: 380px; }
    .news-list .thumbnail { float:none; width:320px; height:180px; margin:0 auto 15px; overflow: hidden;}
    .news-list .entry-meta{ float:none; width:100%; margin-bottom:30px;}
    .news-list .cat {margin-bottom: 10px;}
    .news-list h2.entry-title { clear: both; float:none; font-size: 16px; width:100%;}
}

@media only screen and (max-width:400px) {
    .news-list .post { padding:10px; max-width: 300px;}
    .news-list .thumbnail { width:280px; height:158px;}
}

.category-example { background: #F4F4F4;}
.category-example .site-main { text-align: center;}
.category-example .title { position: relative; display: inline-block; width: 100%; margin:0 auto; font-size: 21px; text-align: center; color: #000; margin-bottom: 50px; letter-spacing: 0.1em; line-height: 1.3;}
.category-example .title span { font-size: 182%;}
.category-example .title:before { content: ''; position: absolute; top: -40px; display: inline-block; width: 60px; height: 1px; left: calc(50% - 30px); background-color:#0086C1; -webkit-transform: rotate(-90deg); transform: rotate(-90deg);}

@media only screen and (max-width: 640px) {
    .category-example .title { font-size: 16px;}
    .category-example .title span { font-size: 150%;}
    .category-example .title:before { top: -30px;  width: 40px;}
}

#example-list { width: 94%; max-width: 1400px; margin: 0 auto 20px auto; text-align:center;}
#example-list:after { content:" "; display:block; clear:both;}
#example-list .post { background: #fff; margin: 0 0 30px 0; padding:30px 30px 20px 30px; box-shadow: 0 0 11px rgba(153, 153, 153, 0.1);}
#example-list .thumbnail { position: relative; width:100%; height:252px; margin-bottom:15px; overflow: hidden;}
#example-list .thumbnail img { width:100%; height:100%; object-fit: cover; position: absolute; top: 0; left: 0;}
#example-list .technology { background: #00B0F0; color: #fff; font-size: 15px; font-weight: bold; margin-bottom: 10px; padding:8px;}
#example-list .company { margin-bottom: 10px; padding: 5px; border-bottom: 1px solid #000; font-size: 18px;}
#example-list h3 { font-size: 16px; text-align: left; margin-bottom: 15px;}

@media only screen and (max-width: 640px) {
    #example-list .post { margin-left: auto; margin-right: auto;}
}

#example-post { width: 94%; max-width: 1400px; text-align: center; margin: 0 auto 80px auto;}
#example-post .about { clear: both; width: 100%; background: #fff; margin-bottom: 30px; padding:60px 50px; text-align:center; box-shadow: 0 0 11px rgba(153, 153, 153, 0.1);}
#example-post .about h3.title { width: 100%; margin-bottom:2em; padding: 5px; border-bottom:2px solid #000; font-size: 30px; text-align: left;}
#example-post .data { width: 100%; margin-bottom: 50px;}
#example-post .data .txt { width: 43%;}
#example-post .data .photo { width: 50%;}
#example-post .thumbnail { position: relative; width:50%; height:252px; margin-bottom:15px; overflow: hidden;}
#example-post .thumbnail img { width:100%; height:100%; object-fit: cover; position: absolute; top: 0; left: 0;}
#example-post .technology { background: #00B0F0; color: #fff; font-size: 19px; font-weight: bold; margin-bottom:20px; padding:9px;}
#example-post .company { margin-bottom:30px; padding: 5px; border-bottom: 1px solid #000; font-size: 27px;}
#example-post .plofile { margin-bottom:40px;}
#example-post .plofile ul li { position: relative; text-align: left; padding:10px 18px; font-size: 17px; border-bottom: 1px dotted #777; }
#example-post .plofile ul li:after { position: absolute; top:16px; left: 1px; font-family: "Font Awesome 5 Free"; content: "\f0c8"; font-size:10px; font-weight:900; color:#0095D2; }
#example-post .plofile a {text-decoration: underline;}

@media only screen and (max-width: 959px) {
    #example-post .about { padding:40px 30px;}
    #example-post .about h3.title {font-size: 23px;}
    #example-post .company { font-size: 23px;}
    #example-post .data .txt { width:100%;}
    #example-post .data .photo { width:100%;}
}

#example-post .subject { }
#example-post .subject .task { position: relative; width: 47%; border: 1px solid #222; }
#example-post .subject .task h4 { background: #222;}
#example-post .subject .task:after { position: absolute; font-family: "Font Awesome 5 Free"; font-size:60px; font-weight:900; color:#0095D2; }
#example-post .subject .result { width: 47%; border: 1px solid #00B0F0;}
#example-post .subject .result h4 { background: #008BC7;}
#example-post .subject h4 { color: #fff; font-size: 20px; font-weight: bold; padding: 7px; margin-bottom: 17px; letter-spacing: 0.1em;}
#example-post .subject p { text-align: left; padding:0 30px;}

@media only screen and (min-width: 960px) {
    #example-post .subject .task:after { top:29%; right: -57px; content: "\f0da"; }
}

@media only screen and (max-width: 959px) {
    #example-post .subject .task { width:100%; margin-bottom: 50px;}
    #example-post .subject .task:after { bottom: -68px; left: 0; right: 0; content: "\f0d7"; }
    #example-post .subject .result { width:100%;}
}

#example-post .detail { clear: both; width: 100%; background: #fff; margin-bottom: 30px; padding:50px; text-align:center; box-shadow: 0 0 11px rgba(153, 153, 153, 0.1);}
#example-post .detail h4 { margin:5px 0 30px; padding: 5px 0; border-bottom: 1px solid #0086C1; font-size: 20px; font-weight: bold; text-align: left;}
#example-post .detail p {text-align: left;}
#example-post .detail .txt { width: 55%;}
#example-post .detail .photo { width: 40%; max-width: 520px; }

@media only screen and (max-width: 959px) {
    #example-post .detail h4 { margin-bottom: 20px;}
    #example-post .detail .txt { width: 100%;}
    #example-post .detail .photo { width: 100%; text-align: center; margin: 0 auto;}
}

#example-post .link { clear: both; width: 100%; margin-bottom: 30px; border: 1px solid #333; background-color: #FFF; line-height: 1.2;}
#example-post .link h4 {width: 190px; padding:21px 10px 16px 10px;}
#example-post .link a { width:calc(100% - 190px); position: relative; display:block; margin: 0 auto; padding: 20px 40px 16px 10px; font-size: 17px; font-weight: bold; color: #222; text-align: center; text-decoration: none; transition: all .3s;}
#example-post .link a:after { position: absolute; right: 15px; font-family: "Font Awesome 5 Free"; content: "\f054"; font-size:16px; color: #222; transition: all .3s;}
#example-post .link a:hover { background: #333; color: #fff;}
#example-post .link a:hover:after {color: #fff;}

@media only screen and (min-width: 641px) {
    #example-post .link h4:after { float: right; content: "："; font-size:16px; color: #222; }
}

@media only screen and (max-width: 640px) {
    #example-post .link h4 { position:relative; width: 100%; text-align: center;}
    #example-post .link h4:after { position: absolute; bottom:2px; left: 0; right: 0; content: "..."; font-size:16px; color: #222; }
    #example-post .link a { width: 100%; }
}

/* ===================================================================
 事業を知る
=================================================================== */
#measure { }
#measure h3 { width: 100%; margin:2em 0; padding: 5px; border-bottom:1px solid #000; font-size: 25px; text-align: left;}
#measure .txt { width:60%; padding:0; text-align: center;}
#measure .txt p{ text-align:left;}
#measure .photo { width:35.4%; margin-bottom:30px;}
#measure ul.measure-link  { }
#measure ul.measure-link li {width: 32%;}
#measure ul.measure-link li a { position: relative; display:block; height: 60px; margin: 0 auto; padding: 0; font-size: 17px; font-weight: bold; border: 1px solid #333; background-color: #FFF; color: #222; text-align: center; text-decoration: none; transition: all .3s; line-height: 60px;}
#measure ul.measure-link li a:after { position: absolute; right: 15px; font-family: "Font Awesome 5 Free"; content: "\f054"; font-size:16px; color: #222; transition: all .3s;}
#measure ul.measure-link li a:hover { background: #333; color: #fff;}
#measure ul.measure-link li a:hover:after {color: #fff;}
#measure ul.measure-link li a:hover i {color: #fff;}

@media only screen and (max-width: 959px) {
    #measure h3 { width: 100%; margin-bottom: 1em; font-size: 20px;}
    #measure .txt { width:100%; margin-bottom: 30px;}
    #measure .photo { width:100%; }
}

@media only screen and (max-width: 640px) {
    #measure ul.measure-link li {width: 100%; margin: 0 auto 15px auto;}
}
/* ===================================================================
 課題から探す
=================================================================== */
#problem { width: 94%; max-width: 1400px; margin:0 auto; padding: 50px 0; }
#problem h3{ text-align: left; font-size: 30px; }
#problem h3 { width:100%; margin-bottom:6px; padding:0 0 0 70px; font-size:31px; font-weight: bold; color: #0086C1; position: relative; display: inline-block; text-align: left; line-height: 1.2;}
#problem h3:before { content: ''; position: absolute; top: 50%; display: inline-block; width: 60px; height: 1px; background-color: #0086C1; left:0;}

#problem dl { clear: both; width: 100%; background: #fff; margin:0 auto 60px auto; padding:30px 50px; box-shadow: 0 0 11px rgba(153, 153, 153, 0.1);}
#problem dl:after { content:" "; display:block; clear:both;}
#problem dl dt { float: left; width: 42%; padding:0; text-align:left; }
#problem dl dd { float: right; width:58%; padding:0 0 0 130px; text-align:left;}
#problem dl dd h4 { font-weight: bold; margin-left: -0.4em;}
#problem dl dd p{ margin:0 0 0.6em 3px; }

#problem dl dd a { position: relative; display:block; margin: 0 auto 0.5em auto; padding: 10px 0 6px 3px; font-size:18px; font-weight: bold; border-bottom: 1px solid #0086C1; color: #00B0F0; text-align:left; text-decoration: none; transition: all .3s;}
#problem dl dd a:before { position: absolute; top:12px; right:5px; font-family: "Font Awesome 5 Free"; content: "\f054"; font-size:15px; font-weight: 900; color: #00B0F0; transition: all .3s;}
#problem dl dd a:hover { background-color:#E5F3F9;}
#problem dl dd i{ margin-left: 0.3em;font-size: 100%; }
#problem dl dt ul {}
#problem dl dt ul li { position: relative; text-align: left; padding:10px 18px; font-size:17px; border-bottom: 1px dotted #777; }
#problem dl dt ul li:after { position: absolute; top:15px; left: 1px; font-family: "Font Awesome 5 Free"; content: "\f0c8"; font-size:10px; font-weight:900; color:#0095D2;}

@media only screen and (min-width: 960px) {
    #problem dl { position: relative;}
    #problem dl dd:before{ position: absolute; top:20%; left:45%; font-family: "Font Awesome 5 Free"; content: "\f35a"; font-size:72px; color: #EEE; }
}

@media only screen and (max-width: 959px) {
    #problem h3 { padding:0 0 0 40px; font-size:21px; }
    #problem h3:before { width: 30px; }
    #problem dl { padding:30px 25px; }
    #problem dl dt { float:none; width:100%; padding:0; text-align:left;}
    #problem dl dd { position: relative; float:none; width:100%; padding:60px 0 0 0; text-align:left;}
    #problem dl dd:before{ position: absolute; top:0; left:0; right: 0; font-family: "Font Awesome 5 Free"; content: "\f358"; font-size:52px; color: #EEE; text-align: center;}
}

/* ===================================================================
 学ぶ・参加する
=================================================================== */
#event { margin-bottom: 80px;}
#event .course { width: 100%;}

#event-sc {margin-bottom: 80px;}
#event-sc .item { clear: both; width:94%; max-width:1400px; background:#fff; margin: 0 auto 30px auto; padding:50px; text-align:center; box-shadow: 0 0 11px rgba(153, 153, 153, 0.1); }
#event-sc .photo { width: 380px; text-align: center;}
#event-sc .photo img { background: #fff; box-shadow: 0 0 11px rgba(153, 153, 153, 0.1);}
#event-sc .txt { position: relative; width: calc(100% - 430px); text-align: left; padding-bottom: 45px;}
#event-sc .txt h3 { margin: 5px 0 0.8em; padding:0 5px 5px 0; font-size:23px; font-weight: bold; text-align:left; border-bottom: 1px solid #0086C1; line-height: 1.35;}
#event-sc .txt p { margin-bottom: 0.5em;}
#event-sc .txt .target { width: 300px; max-width: 100%; margin: 8px 0 10px 0; padding:12px 0 10px; background: #00B0F0; color: #fff; font-size: 15px; font-weight: bold; text-align: center; line-height: 1;}
#event-sc .txt .btn-s { position: absolute; right: 0; bottom: 0;}

@media only screen and (max-width:959px) {
    #event-sc .item {padding:25px;}
    #event-sc .photo { width: 280px; text-align: center;}
    #event-sc .txt {  width: calc(100% - 310px); }
}

@media only screen and (max-width:640px) {
    #event-sc .item { max-width: 430px; padding:25px;}
    #event-sc .photo,
    #event-sc .txt { width: 100%;}
}

.event-catch { width:94%; max-width:1400px; margin: 0 auto 50px auto;}
.event-catch p { font-size: 17px; font-weight: bold;}
#event-post {margin-bottom: 80px;}
#event-post #event-new { width: 100%; margin: 0 auto 50px auto; padding:20px 0 40px 0; background: url("../images/event_new_bg.jpg") repeat center bottom;}
#event-post #event-new h2.tit2 { margin:50px auto 13px; color:#fff;}
#event-post #event-new h2.tit2 i { margin-right: 0.2em; color:#fff;}
#event-post #event-new h2.tit2:before { background-color:#fff;}

#event-record h2.tit2 { position: relative; width:94%; max-width:1400px; margin:50px auto 0 auto; padding: 10px 10px 8px 10px; background: #fff;}
#event-record h2.tit2 i { margin-right: 0.2em; color:#4CAAD3;}
#event-record h2.tit2:hover{ opacity:0.80; filter: alpha(opacity=80); cursor: pointer;}
#event-record h2.tit2:after{ float: right; font-family: "Font Awesome 5 Free"; content: "\f150"; color:#4CAAD3; font-size:25px; margin-top: 5px;}
#event-record h2.tit2.open:after{ content: "×"; font-weight: 900; font-size:27px;}
#event-record h2.tit2.open{ background:none; }

#event-post .record {}
#event-post .item { clear: both; width:94%; max-width:1400px; background:#fff; margin: 0 auto 30px auto; padding:50px; text-align:center; box-shadow: 0 0 11px rgba(153, 153, 153, 0.1); }
#event-post .photo { width: 250px; text-align: center; font-size: 15px;}
#event-post .photo img {max-width: 100%;}
#event-post .txt { text-align: left;}
#event-post .flex .txt { width: calc(100% - 300px); }
#event-post .item h3 { clear: both; width: 100%; font-size:23px; margin:0 0 20px 0; padding:12px 10px 10px 10px; background: #D5DFEE; text-decoration:none; text-align: left; display: block;}
#event-post .item h3:after{ content:" "; display:block; clear:both;}
#event-post .item h4 { width:100%; margin:30px 0 15px 0; padding:0 5px 2px 0; text-align:left; border-bottom: 1px solid #0086C1; font-size:18px; font-weight: bold; color:#0086C1; line-height: 1.35; }
#event-post .item p { margin-bottom: 0.5em;}
#event-post .item ul li { position: relative; text-align: left; font-size: 15px; padding:6px 18px; border-bottom: 1px dotted #777; }
#event-post .item ul li:after { position: absolute; top:10px; left: 1px; content: "●"; font-size:10px; color:#0095D2;}
#event-post .item ul li ul li { position: relative; text-align: left; padding:1px 14px; font-size: 15px; border-bottom: none; }
#event-post .item ul li ul li:after { position: absolute; top:7px; left: 1px; content: "●"; font-size:7px; color:#4CAAD3;}
#event-post .item ul li span {color: #444; margin-right: 0.3em;}

#event-post .item dl,
#event-post .item dt,
#event-post .item dd { box-sizing: border-box; text-align: left; font-size: 15px;}
#event-post .item dl { width: 100%; margin-top: 15px; margin-bottom: 15px; background: #F6F6F6; text-align: center; border-bottom: 1px dotted #777; border-top: none;}
#event-post .item dt,
#event-post .item dd { padding: 0.5em 1em 0 1em; border-top: 1px dotted #777;}
#event-post .item dt {width: 200px; float: left; color: #444;}
#event-post .item dd { background: #FFF; margin-left: 200px; padding-bottom: 0.3em; }
#event-post .item dd:after { content: ''; display: block; clear: both;}

@media only screen and (max-width: 640px) {
    #event-post .item dt { width: 100%; float: none; padding-bottom: 0.5em; }
    #event-post .item dd { margin-left: 0; border-left: none;}
}

@media only screen and (max-width:959px) {
    .event-catch p { text-align: left;}
    #event-post .item {padding:25px;}
    #event-post .photo { width: 180px; margin: 0 auto;}
    #event-post .flex .txt { width: calc(100% - 200px); }
}

@media only screen and (max-width:640px) {
    #event-post .item { padding:25px;}
    #event-post .flex .txt { width: 100%; margin-bottom: 20px;}
}

/* ===================================================================
 支援について
=================================================================== */
#support { width: 94%; max-width: 1400px; margin:0 auto; padding: 50px 0; }
#support .item {position: relative; width: 48%; background:#fff; margin: 0 0 40px 0; padding:40px 50px 50px 50px; text-align:center; box-shadow: 0 0 11px rgba(153, 153, 153, 0.1); }
#support .item h3 { position: relative; display:block; width: 100%; margin: 0 auto 0.5em auto; padding: 10px 20px 6px 3px; font-size:25px; border-bottom: 1px solid #0086C1; text-align:left; text-decoration: none; transition: all .3s;}
#support .item h3:before { position: absolute; top:12px; right:5px; font-family: "Font Awesome 5 Free"; content: "\f054"; font-size:20px; font-weight: 900; color: #00B0F0; transition: all .3s;}
#support .item p {text-align:left;}
#support .item a { position: absolute; top: 0; left: 0; height:100%; width: 100%; }
#support .item .target { background: #D5DFEE; margin-top: 30px; padding: 18px 15px 1px 15px;}
#support .item:hover{ background-color:#F2FBFE;}
#support .item:hover .target { background: #CADDEE;}

@media only screen and (max-width:959px) {
    #support .item {width: 100%; max-width: 650px; margin: 0 auto 30px auto;}
    #support .item h3 { font-size: 20px;}
}

/* ===================================================================
 支援について 詳細
=================================================================== */
#subsidy { width:100%; margin:0 auto; }
#subsidy .txt { width:57%; padding:0; text-align: left;}
#subsidy .txt p{ text-align:left;}
#subsidy .photo { width:40%; margin-bottom:30px;}
#subsidy h3 { width: 100%; margin:0 0 1em 0; padding: 5px; border-bottom:1px solid #000; font-size: 31px; text-align: left;}
#subsidy h4 { text-align: center; font-size: 30px; margin: 0 auto; padding: 15px 0; line-height: 1.3; letter-spacing: 0.1em; font-weight: bold; color: #0085C0;}

/* 吹き出し本体 */
#subsidy .balloon{ position: relative; margin:0 0 10px 0; padding: 14px 40px; background-color: #00B0F0; color: #fff; font-size: 21px; font-weight: bold; border-radius: 10px; display: inline-block;}
/* 色付きの半円 */
#subsidy .balloon::before{ content: ''; position: absolute; display: block; width: 0; height: 0; border-radius: 50%; transform: rotate(-45deg); left: 20px; bottom: -10px;
  border-left:14px solid #00B0F0;
  border-top:14px solid transparent;
  border-right:14px solid transparent;
  border-bottom:14px solid #00B0F0;
}
/* 白い半円 */
#subsidy .balloon::after{ content: ''; position: absolute; display: block; width: 0; height: 0; border-radius: 50%; transform: rotate(-45deg); left: 30px; bottom: -14px;
  border-left:14px solid #ffffff;
  border-top:14px solid transparent;
  border-right:14px solid transparent;
  border-bottom:14px solid #ffffff;
}

@media only screen and (max-width:959px) {
    #subsidy .txt { width:100%;}
    #subsidy .photo { width: 100%; }
    #subsidy h3 {font-size: 21px;}
    #subsidy .balloon{font-size: 17px;}
}

#subsidy .link { width: 94%; max-width: 1400px; margin:0 auto; padding: 0 0 50px 0; }

#condition.box {padding-bottom:20px;}
#condition h3 { width: 100%; margin:0 0 1em 0; padding: 5px; border-bottom:1px solid #000; font-size:26px; text-align: left;}
#condition h3 i { padding-right: 0.3em;}
#condition section { margin: 0 auto 30px auto; padding:0;}
#condition h4 { font-size: 20px; padding: 0; margin: 0 0 0.5em 0; font-weight: bold; color: #0086C1; text-align: left;}
#condition ul { width: 100%; margin: 0 auto;}
#condition ul li { padding:1em 0.5em 0.8em 0.5em; background:#04769C; font-weight: bold; border-radius: 12px; color: #FFF; margin-bottom: 20px; line-height: 1.2;}
#condition ul li:nth-child(2n) { background:#024C6D;}
#condition ul li:nth-child(3n) { background:#013057;}
#condition ul li i { font-size: 25px; padding-bottom: 0.3em; color: #ADDBE6;}
#condition p { text-align: left;}

#condition .table-outer { width: 100%;}
#condition table { border-collapse: collapse; width: 100%;}
#condition table th,
#condition table td { border: 1px solid #ccc; padding: 10px; vertical-align:middle;}
#condition table th { background-color: #eee;}
#condition table td { text-align: center;}
#condition table td:first-child { background: #F2F8FA;}
#condition table td:last-child { text-align: left;}
#condition table th.tb1 {width: 140px;}
#condition table th.tb2 {width: 160px;}

@media screen and (max-width:959px) {
    #condition h3 { font-size: 20px;}
    #condition h4 { font-size: 17px;}
    #condition .table-outer { width: 100%; overflow-y:hidden; overflow-x:scroll; padding: 10px;}
    #condition table { width: 870px;}
    #condition table th,
    #condition table td {font-size: 15px;}
    #condition table th.tb1 {width: 110px;}
    #condition table th.tb2 {width: 128px;}
}

/* 産業用ロボット導入事前検証・事業化可能性調査事業費補助金 ----------- */
#robot {}
#robot h3 { width: 100%; margin:0 0 1em 0; padding: 5px; border-bottom:1px solid #000; font-size:26px; text-align: left;}
#robot h3 i { padding-right: 0.3em;}
#robot section { margin: 0 auto 30px auto; padding:0;}
#robot h4 { font-size: 18px; padding: 0; margin: 1.3em 0 0.2em 0; font-weight: bold; color: #0086C1; text-align: left;}
#robot p { text-align: left;}
#robot ul { width: 100%; margin: 0 auto;}
#robot ul li { text-align: left;}
#robot ol { width: 100%; margin: 0 0 0 1.2em;}
#robot ol li { text-align: left; margin-bottom: 0.5em;}
#robot .sub{ border: 1px solid #ddd; margin-top:30px; padding:20px 30px 15px 30px;}
#robot .sub h5 {text-align: left; margin-bottom: 0.7em; font-weight: bold; color: #024C6D;}
#robot .sub ul {}
#robot .sub ul li { position: relative; text-align: left; font-size: 15px; padding:3px 0 3px 18px; line-height: 1.35; }
#robot .sub ul li:after { position: absolute; top:7px; left: 1px; content: "●"; font-size:10px; color:#0095D2;}

@media screen and (max-width:959px) {
    #robot h3 { font-size: 20px;}
    #robot h4 { font-size: 17px;}
}

#robot ul.robot-link  {justify-content:flex-start; }
#robot ul.robot-link li {width: 315px; margin:0 10px 10px 0;}
#robot ul.robot-link li a { position: relative; display:block; height: 60px; margin: 0 auto; padding: 0; font-size: 16px; font-weight: bold; border: 1px solid #333; background-color: #FFF; color: #222; text-align: center; text-decoration: none; transition: all .3s; line-height: 60px;}
#robot ul.robot-link li a span {font-size: 14px;}
#robot ul.robot-link li a:after { position: absolute; right: 15px; font-family: "Font Awesome 5 Free"; content: "\f054"; font-size:16px; color: #222; transition: all .3s;}
#robot ul.robot-link li a:hover { background: #333; color: #fff;}
#robot ul.robot-link li a:hover:after {color: #fff;}
#robot ul.robot-link li a:hover i {color: #fff;}


/* ===================================================================
 静岡県IoT導入推進コンソーシアム
=================================================================== */
#consortium {}
#consortium .txt { width:46%; padding:0; text-align: center;}
#consortium .txt p{ text-align:left;}
#consortium h4 { font-size: 20px; margin: 0 auto; padding: 15px 0; line-height: 1.3; letter-spacing: 0.1em; font-weight: bold; }
#consortium h4 strong{ font-size:30px; color: #0085C0; font-weight: bold;}
#consortium .photo { width:50%; margin-bottom:30px;}
#consortium .txt2 {}
#consortium .txt2 .btn-entry {margin: 10px auto 0 auto;}

#consortium ul.consortium-link { clear: both; width: 100%;}
#consortium ul.consortium-link li {width:100%;}
#consortium ul.consortium-link li a { position: relative; display:block; height: 60px; margin: 0 auto 10px auto; padding: 0; font-size: 16px; font-weight: bold; border: 1px solid #333; background-color: #FFF; color: #222; text-align: center; text-decoration: none; transition: all .3s; line-height: 60px;}
#consortium ul.consortium-link li a:after { position: absolute; right: 15px; font-family: "Font Awesome 5 Free"; content: "\f054"; font-size:16px; color: #222; transition: all .3s;}
#consortium ul.consortium-link li a:hover { background: #333; color: #fff;}
#consortium ul.consortium-link li a:hover:after {color: #fff;}
#consortium ul.consortium-link li a:hover i {color: #fff;}

@media only screen and (max-width:959px) {
    #consortium .txt { width:100%;}
    #consortium .photo { width:100%; margin-top: 15px;}
}

#consortium-list h3 { width: 100%; margin:0 0 1em 0; padding: 5px; border-bottom:1px solid #000; font-size: 25px; text-align: left;}
#consortium-list p{ text-align:left;}
#consortium-list .txt { width:58%; padding:0; text-align: center;}
#consortium-list .photo { width:37%; }
#consortium-list .btn{ margin-top: 15px;}

#consortium-list .gmap { position: relative; width:100%; min-height: 360px; margin:0 auto 3px auto; padding-top: 56.25%;}
#consortium-list .gmap iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important;}
#consortium-list .gmap:after { content:" "; display:block; clear:both;}

@media only screen and (max-width:959px) {
    #consortium-list .txt { width:100%;}
    #consortium-list .photo { width:100%; margin-top: 15px;}
}

#consortium-associate { clear: both; width: 100%; padding-top: 40px;}
#consortium-associate ul {margin-bottom: 30px; justify-content:flex-start;}
#consortium-associate ul li { width: 25%; margin-bottom: 10px;}
#consortium-associate p {text-align:center; margin-bottom: 0.3em;}

#consortium-movie { width: 100%; max-width: 1400px; margin:0 auto;}
#consortium-movie .movie-item { width: 48%; margin:0; padding-bottom: 3px; font-weight: bold; color: #000;}
#consortium-movie .movie { position: relative; width:100%; margin:0 auto 3px auto; padding-top: 56.25%;}
#consortium-movie .movie iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important;}
#consortium-movie .movie:after { content:" "; display:block; clear:both;}

@media only screen and (max-width:959px) {
    #consortium-movie { width:94%; max-width: 660px; margin:0 auto;}
    #consortium-movie .movie-item { width: 100%; margin-bottom: 15px;}
	#consortium-movie .movie { clear:both; width:100%; margin:0 auto; }
	#consortium-movie .movie iframe { }
}

/* ===================================================================
 お問い合わせ
=================================================================== */
#inquiry { width:94%; max-width:1000px; background: #fff; margin:0 auto 60px; padding:50px 5%; text-align: center; box-shadow: 0 0 11px rgba(153, 153, 153, 0.1);}
#inquiry h3 { font-size: 23px; margin-bottom: 1.5em; font-weight: bold;}
#inquiry dl { clear:both; width:100%; margin:0 auto; text-align:left; border-bottom:1px solid #AAA; line-height: 1; }
#inquiry dt { padding:15px 0 10px 20px; clear:left; float:left; width:10em; border-top:1px solid #AAA; color:#555; }
#inquiry dd { padding:15px 0 10px 20px; margin-left:10em; border-top:1px solid #AAA; }
#inquiry dl:after, #inquiry dt:after, #inquiry dd:after { content:" "; display:block; clear:both;}

@media only screen and (max-width: 640px) {
    #inquiry h2 { text-align: left; font-size: 18px;}
	#inquiry dt { clear: both; float: none; width: 100%; padding-bottom: 2px; }
	#inquiry dd { margin-left:0; border-top:none; }
}


/* ===================================================================
 404
=================================================================== */
#page-error404 #main p { text-align: center; font-size: 16px; }
#page-error404 #main { height: 37vh; padding: 0 20px;}

@media only screen and (max-width: 640px) {
    #page-error404 #main p { text-align: center; font-size: 14px; }
}