@charset "UTF-8";

/*================================================
 *  CSSリセット
 ================================================*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;font-weight:normal;}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}

/*================================================
 *  一般・共通設定
 ================================================*/
body {
font-size:17px;
color:#333;
font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
line-height:1.4;
background:#fff;
}

.inner {
position:relative;
width:980px;
margin:0 auto;
height:20px;
}

header {
box-sizing:border-box;
position:relative;
width:100%;
background:#fcfcfc;
border-bottom:5px solid #CCC;
}

nav {
width:100%;
background:#fff;
box-shadow:0 1px 2px #FFF;
?zoom:1;
}
nav:after {
   content:'';
   display:block;
   clear:both;
}

#contents {
overflow:hidden;
width:980px;
margin:3px auto;
background:#fff;
}

.description {
text-align:center;
font-size:70%;
margin:10px;
}

#main {
box-sizing:border-box;
overflow:hidden;
float:left;
width:100%;
}

#sub {
box-sizing:border-box;
overflow:hidden;
float:right;
width:29%;
}

footer {
box-sizing:border-box;
width:100%;
margin:0 auto;
}

a {
color:#333;
text-decoration:none;
}
a:hover {
color:#0058AA;
text-decoration:none;
}

h2 {
margin-bottom:0.7em;
padding:3px 8px;
color:#fff;
font-size:140%;
font-weight:bold;
background:#0090DA;
border-left: 6px solid #0058A9;
}

h3 {
background: url(../images/index_img/qr_mark.jpg) no-repeat;
padding: 5px 0px 4px 45px;
margin:0.5em 0;
font-size:21px;
font-weight:bold;
color:#333;
border-bottom:1px dotted #0058AA;
border-top:1px dotted #0058AA;
}

h4 {
margin-bottom:0.25em;
font-size:18px;
font-weight:bold;
color:#0058AA;
border-bottom:3px dotted #0058AA;
}

h5 {
position:relative;
margin-bottom:0.25em;
padding-left:10px;
color:#0058AA;
font-size:14px;
font-weight:bold;
}

h5:before {
content:"";
margin-top:-7px;
position:absolute;
top:50%;
left:0;
width:5px;
height:14px;
background:#FFF;
}

h6 {
margin-bottom:0.25em;
color:#382400;
font-size:14px;
font-weight:bold;
}

p {
margin:0;
font-weight:bold;
font-size:140%;
color:#18A9B3;
}

img {
vertical-align:bottom;
}

em {
font-weight:bold;
}

strong {
font-weight:bold;
color:#ff0000;
}

pre {
margin:1em 0;
padding:1em;
}

blockquote {
margin-bottom:1em;
padding:1em;
border:1px dotted #ddd;
border-left:5px solid #ddd;
}

ul,ol,dl {
margin:0 0 0.3em 0;
}
ul li {
list-style:disc;
}
ol li {
list-style:decimal;
}
li {
margin-left:2em;
}

dt {
margin-bottom:0em;
}

dd {
margin-bottom:0.5em;
}

table {
width:100%;
margin-bottom:0.5em;
border-collapse:collapse;
background:#FFF;
border:1px solid #FFF;
}

th {
width:25%;
padding:10px;
text-align:center;
vertical-align:middle;
background:#efefef;
border:1px solid #FFF;
font-weight:bold;
white-space: nowrap;
}

td {
padding:10px;
vertical-align:middle;
text-align:left;
border:1px solid #FFF;
}

/*================================================
 *  ヘッダー
 ================================================*/
header {
padding:10px 10px;
}

.summary {
text-align:center;
margin:0 auto;
}

/*================================================
 *  グローバルナビゲーション
 ================================================*/
@media print, screen and (min-width:768px) {
nav {
background:#999;
border-bottom:3px solid #666;
z-index:3;
margin-top:5px;
}

nav ul {
margin:0;
padding:0;
}

nav li {
position:relative;
width:25%;
float:left;
margin:0;
padding:0;
text-align:center;
list-style:none;
}

nav li:first-child {
width:25%;
}

nav li:before {
content:"";
margin-top:-7px;
position:absolute;
top:50%;
left:0;
width:1px;
height:14px;
background:#FFF;
}

nav li:last-child:after {
content:"";
margin-top:-7px;
position:absolute;
top:50%;
right:0;
width:1px;
height:14px;
background:#FFF;
}

nav li:hover:before,
nav li:hover + li:before, 
nav li:last-child:hover:after,
nav li li:before,
nav li li:after {
display:none;
}

nav li:last-child li {
left:-50%;
}

nav li a {
display:block;
padding:10px 0;
color:#fff;
font-weight:bold;
text-decoration:none;
}

nav li ul {
display:block !important;
position:absolute;
top:100%;
left:0;
margin:0;
padding:0;
border-radius:0 0 3px 3px;
z-index:3;
}

nav li ul li {
overflow:hidden;
width:150%;
height:0;
-moz-transition:.2s;
-webkit-transition:.2s;
-o-transition:.2s;
-ms-transition:.2s;
transition:.2s;
}

nav li li:first-child {
width:150%;
}

nav li ul li a {
padding:10px 15px;
background:#009DF2;
text-align:left;
font-weight:normal;
}

nav li:hover > a {
background:#CCC;
color:#fff;
}

nav li:hover > a:hover {
background:#666;
}

.gnav {
display:block !important;
}

#spMenu {
display:none;
}

.showNav {
background:#7c0c0c !important;
}

.showSub {
overflow:visible;
min-height:42px;
border-bottom:2px solid #FFF;
}

.showSub:last-child {
border-bottom:0;
}

.showSub:last-child a {
border-radius:0 0 3px 3px;
}

/*
.fixed {
position:fixed;
top:0;
left:0;
}
*/

/*================================================
 *  トピックパス（パンくずリスト）
 ================================================*/
#topicpath {
font-size:12px;
margin:20px 0;
padding:2px;
}

/*================================================
 *  サブコンテンツ
 ================================================*/
.submenu li {
margin:0;
padding:0;
list-style:none;
}
.submenu li a:before {
content:"\0025a0";
color:#000;
}
.submenu li a {
display:block;
padding:10px 2px;
color:#000;
border-bottom:1px dotted #ddd;
text-decoration:none;
}
.submenu li a:hover {
background:#eee;
}

.bnr {
overflow:hidden;
}
.bnr ul {
overflow:hidden;
}
.bnr li {
margin:0 0 10px 0;
padding:0;
list-style:none;
}
.bnr li a:hover {
opacity:0.8;
filter:alpha(opacity=80);
-ms-filter:"alpha( opacity=80 )";
}
.bnr img {
width:100%;
}

/*================================================
 *  トピックス
 ================================================*/

#topics_cont {
margin-top:5px;
margin-bottom:30px;
}

#btn_set_topics {
padding:18px 200px 0 0;
list-style-type: none;
}

#btn_set_topics li {
float:left;
padding:8px;
}

.topics_maincont_news {
height:167px;
padding:3px 0 3px 3px;
overflow:auto;
font-family: "メイリオ", Meiryo;
font-size: 14px;
border:1px solid #ccc;
}

.topics_maincont_sem {
width:835px;
height:132px;
margin:0 0 0 22px;
padding:3px 0 3px 3px;
overflow:auto;
font-family: "メイリオ", Meiryo;
font-size: 14px;
margin-top:15px;
border:1px solid #ccc;
}

.space_sem{
height:24px;
margin:6px 0 0 0;
}

.oshirase {
width:81px;
font-size:14px;
background-image: url("../images/index_img/ico_oshirase.png");
background-repeat: no-repeat;
float:left;
padding:18px 0 0 1px;
margin-right:5px;
}

.sem {
width:81px;
font-size:14px;
background-image: url("../images/index_img/ico_sem.png");
background-repeat: no-repeat;
float:left;
padding:18px 0 0 4px;
margin-right:5px;
}

.sem_e {
width:81px;
font-size:14px;
background-image: url("../images/index_img/ico_sem_e.png");
background-repeat: no-repeat;
float:left;
padding:18px 0 0 4px;
margin-right:5px;
}

.sem_c {
width:81px;
font-size:14px;
background-image: url("../images/index_img/ico_sem_c.png");
background-repeat: no-repeat;
float:left;
padding:18px 0 0 4px;
margin-right:5px;
}

.seibi {
width:81px;
font-size:14px;
background-image: url("../images/index_img/ico_seibi.png");
background-repeat: no-repeat;
float:left;
padding:18px 0 0 4px;
margin-right:5px;
}

.media {
width:81px;
font-size:14px;
background-image: url("../images/index_img/ico_media.png");
background-repeat: no-repeat;
float:left;
padding:18px 0 0 4px;
margin-right:5px;
}

.text {
font-size:90%;
line-height:1.34em;
overflow:visible;
}

.c-both{
clear:both;
border-bottom:1px dotted #b1b1b1;
margin:3px 0 3px 0;
padding-top:10px;
}

.c-both-info{
clear:both;
border-bottom:1px dotted #b1b1b1;
margin:3px 0 3px 0;
}

/*================================================
 *  フッター
 ================================================*/
footer {
clear:both;
}

.footmenu {
width:100%;
padding:20px 0;
overflow:hidden;
background:#efede9;
}
.footmenu ul {
position:relative;
float:left;
left:50%;
margin:0;
padding:0;
}
.footmenu li {
position:relative;
left:-50%;
float:left;
list-style:none;
margin:0;
padding:0 15px;
font-size:12px;
text-align:center;
}
.footmenu a {
color:#333;
text-decoration:none;
}
.footmenu a:hover {
color:#333;
text-decoration:underline;
}

.copyright {
clear:both;
padding:20px 0;
font-size:11px;
text-align:center;
color:#efede9;
background:#2e2e2e;
}

/*================================================
 *  ページトップへの戻り
 ================================================*/
.totop {
position:fixed;
bottom:15px;
right:15px;
}
.totop a {
display:block;
text-decoration:none;
}
.totop img {
background:#0090DA;
}
.totop img:hover {
background:#30aeef;
}

/*================================================
 *  クラス
 ================================================*/
.list {
padding:0 0 0 0.5em;
}
.list li {
margin:0;
padding:0 0 0 15px;
list-style:none;
background:url(../images/check.png) 0 5px no-repeat;
}

.info dt {
border-bottom:none;
}
.info dd {
padding-bottom:0.3em;
border-bottom:1px solid #ddd;
}

.col_two_one {
overflow:hidden;
}

.col_two_one ul {
overflow:hidden;
margin:2% -2% 0 0;
}
.col_two_one li {
list-style:none;
float:left;
width:48%;
margin:0 2% 2% 0;
}
.col_two_one li:nth-child(2n+1) {
clear:both;
}
.col_two_one li img {
width:100%;
margin-bottom:2.5%;
}

.contents_detail{
padding:10px;
font-size:115%;
}

.contents_detail2{
padding:0px 10px 15px 10px;
}

.qa_q{
font-size:150%;
font-weight:bold;
color:#FF3300;
}

.qa_a{
font-size:150%;
font-weight:bold;
color:#b1b1b1;
}

dl{
line-height:1.8em;
overflow: hidden;
}

dl dd,
dl dt{
text-indent: -2.3em;   
padding: 0 0 0 35px;
}

dl dt{
margin:15px 0 0 0;
}

dl dd:first-letter,
dl dt:first-letter{
font-size: 1.6em;
font-weight: bold;
margin-right:10px;
padding:5px;
font-family: sans-serif;
}

dl dd{
margin:0 0 -1px 0;
padding-bottom:15px;
border-bottom:1px #F0F0F0 dotted;
}

dl dt:first-letter{
color:#FF3300;
}
dl dd:first-letter{
color:#b1b1b1;
}

#service{
margin-top:-50px;
padding-top:50px;
}

#service01{
margin-top:-50px;
padding-top:50px;
}

#sample{
margin-top:-50px;
padding-top:50px;
}

#qa{
margin-top:-50px;
padding-top:50px;
}

#submit{
margin-top:-50px;
padding-top:50px;
}

.course{
float:left;
padding-top:160px;
}

.course0{
float:left;
width:275px;
height:180px;
margin:20px 15px 0 0;
padding:10px 15px;
background-color:#F6F6F6;
border-top:3px solid #666;
border-right:1px solid #F0F0F0;
border-left:1px solid #F0F0F0;
border-bottom:3px solid #666;
text-align:center;
border-radius: 3px;        /* CSS3草案 */
-webkit-border-radius: 3px;    /* Safari,Google Chrome用 */
-moz-border-radius: 3px;   /* Firefox用 */
}


a.course1{
display:block;
float:left;
width:275px;
height:220px;
margin:5px 0 5px 10px;
padding:10px 15px;
background-color:#FEF5E7;
color:#C16301;
border-top:3px solid #C16301;
border-right:1px solid #F0F0F0;
border-left:1px solid #F0F0F0;
border-bottom:3px solid #C16301;
text-align:center;
/*border-radius: 3px;         CSS3草案 */
/*-webkit-border-radius: 3px;     Safari,Google Chrome用 */
/*-moz-border-radius: 3px;    Firefox用 */
}

a.course1:hover{
background-color:#FDE7C6;
color:#834201;
border-top:3px solid #834201;
border-right:1px solid #F0F0F0;
border-left:1px solid #F0F0F0;
border-bottom:3px solid #834201;
text-align:center;
}

a.course3{
display:block;
float:left;
width:275px;
height:220px;
margin:5px 0 5px 20px;
padding:10px 15px;
background-color:#F2F8DE;
color:#2A7E3E;
border-top:3px solid #2A7E3E;
border-right:1px solid #F0F0F0;
border-left:1px solid #F0F0F0;
border-bottom:3px solid #2A7E3E;
text-align:center;
/*border-radius: 3px;         CSS3草案 */
/*-webkit-border-radius: 3px;     Safari,Google Chrome用 */
/*-moz-border-radius: 3px;    Firefox用 */
}

a.course3:hover{
background-color:#E9F2C6;
color:#1D562C;
border-top:3px solid #1D562C;
border-right:1px solid #F0F0F0;
border-left:1px solid #F0F0F0;
border-bottom:3px solid #1D562C;
text-align:center;
}

a.course2{
display:block;
float:right;
width:275px;
height:220px;
margin:5px 10px 5px 0;
padding:10px 15px;
background-color:#F3E4F0;
color:#893A91;
border-top:3px solid #893A91;
border-right:1px solid #F0F0F0;
border-left:1px solid #F0F0F0;
border-bottom:3px solid #893A91;
text-align:center;
/*border-radius: 3px;         CSS3草案 */
/*-webkit-border-radius: 3px;     Safari,Google Chrome用 */
/*-moz-border-radius: 3px;    Firefox用 */
}

a.course2:hover{
background-color:#EAD0E4;
color:#5E2864;
border-top:3px solid #5E2864;
border-right:1px solid #F0F0F0;
border-left:1px solid #F0F0F0;
border-bottom:3px solid #5E2864;
text-align:center;
}

/*================================================
 *  ボタン
 ================================================*/

.Search_btn{
width:100%;
margin:15px 0 25px;
box-shadow:none;
color:#fff;
font-size:150%;
text-align:center;
clear:both;
}

.Search_listbtn.clearBorder{
position: relative;
background:0 0;
color:#FFF;
background-color:#B3B3B3;
padding:5px 10px;
margin:0 65px 35px 70px;
box-shadow: 0 3px 0 #8E8E8E;
text-shadow:1px 1px 3px rgba(0,0,0,0.5);
font-size:110%;
}

.Search_listbtn.clearBorder:hover{
opacity: 0.8;
}

.Search_listbtn.clearBorder:active{
top: 3px;
box-shadow: none;
}

.Search_listbtn1.clearBorder{
position: relative;
background:0 0;
color:#FFF;
background-color:#ff4400;
padding:5px 10px;
box-shadow: 0 3px 0 #ffcc83;
text-shadow:1px 1px 3px rgba(0,0,0,0.5);
}

.Search_listbtn1.clearBorder:hover{
opacity: 0.8;
}

.Search_listbtn1.clearBorder:active{
top: 3px;
box-shadow: none;
}


.Search_listbtn{
display:inline-block;border-radius:3px;
cursor:pointer;
transition:.2s;
}

button.submit_btn{
position: relative;
font-size: 1em;
font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
padding: 5px 30px;
color: #fff;
border-style: none;
box-shadow: 0 3px 0 #FF9900;
text-shadow: 1px 1px 2px #000;
background-color:#ff9600;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}


button.submit_btn:hover {
opacity: 0.8;
}

button.submit_btn:active{
top: 3px;
box-shadow: none;
}

/*================================================
 *  フォーム
 ================================================*/
#submit_1{
margin-top:20px;
padding:0px;
text-align:center;
}

tr .mg {
margin:10px 0 10px 0;
}

.agree {
padding: 10px;
height: 75px;
overflow: auto;
background-color: #fff;
line-height: 1.34em;
border: 1px solid #cccccc;
margin-bottom: 20px;
}

.join_textarea{
width:93%;
font-size:150%;
margin:0;
padding:5px 15px;
vertical-align:middle;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

.Table_style select{
font-size:125%;
}

input[type=checkbox] {
width: 15px;
height: 15px;
vertical-align: top;
}
input[type=radio] {
width: 15px;
height: 15px;
vertical-align: top;
}

textarea::-webkit-input-placeholder {
color: #c3c3c3;
font-weight:bold;
font-size:60%;
}

textarea:-moz-placeholder {
color: #c3c3c3;
font-weight:bold;
font-size:60%;
}

textarea:-ms-input-placeholder{
color: #c3c3c3;
font-weight:bold;
font-size:80%;
}


/*================================================
 *  スライドショー
 ================================================*/
.slide {
display:none;
position:relative;
overflow:hidden;
margin:10px 0 10px 0;
}

.slidePrev {
position:absolute;
cursor:pointer;
z-index:2;
}

.slideNext {
position:absolute;
cursor:pointer;
z-index:2;
}

.slidePrev img {
position:absolute;
width:50px !important;
height:60px !important;
}

.slideNext img {
position:absolute;
width:50px !important;
height:60px !important;
}

.slideInner {
position:relative;
margin:0 0 5px 0;
padding:0;
}
.slideInner li {
float:left;
margin:0;
padding:0;
list-style:none;
}
.slideInner li img {
margin:0 5px;
padding:0;
}

.filterPrev {
position:absolute;
left:0;
opacity:0.9;
filter:alpha(opacity=90);
background-color:#fff;
}

.filterNext {
position:absolute;
right:0;
opacity:0.9;
filter:alpha(opacity=90);
background-color:#fff;
}

.controlNav {
position:relative;
float:left;
left:50%;
}
.controlNav span {
position:relative;
left:-50%;
float:left;
margin:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
width:10px;
height:10px;
overflow:hidden;
background:#ccc;
text-indent:-9999px;
vertical-align:middle;
}
.controlNav span:hover {
background:#999;
cursor:pointer;
}
.controlNav span.current {
background:#0058AA;
}

/*================================================
 *  タブレット向けデザイン
 ================================================*/
/* スクロールバーを考慮して20px大きいサイズで切り替え */
@media screen and (max-width:979px) {
.inner {
width:100%;
}

#contents {
box-sizing:border-box;
width:100%;
padding:0 10px;
}

footer {
width:100%;
}
}

/*================================================
 *  スマートフォン向けデザイン
 ================================================*/
@media screen and (max-width:767px) {
.lock {
overflow:hidden;
}

header {
z-index:2;
box-sizing:border-box;
position:fixed;
top:0;
left:0;
width:100%;
padding:15px 10px;
}

.summary {
position:relative;
top:auto;
right:auto;
margin-top:15px;
}

#main {
float:none;
width:100%;
}

#sub {
float:none;
width:100%;
}

nav {
background:#710000;
}
nav ul {
margin:0;
padding:0;
}

nav .inner > ul {
z-index:2;
overflow:auto;
position:fixed;
top:53px;
right:0;
width:100%;
height:88%;
height:-webkit-calc(100% - 53px);
height:calc(100% - 53px);
}
nav li {
position:relative;
width:100%;
float:none;
margin:0;
text-align:left;
list-style:none;
border-bottom:1px solid #FFF;
background:#9b0f0f;
}

nav li:first-child {
border-top:0;
}
nav li:last-child {
border-bottom:0;
}

nav li a {
display:block;
padding:10px 30px;
color:#fff;
text-decoration:none;
background:#9b0f0f;
}
nav li a:hover {
color:#fff;
background:#710000;
}
nav ul ul {
display:none;
position:relative;
}
nav li li a {
box-sizing:border-box;
width:100%;
padding:10px 30px 10px 50px;
text-align:left;
}

.subnav > a:before {
display:block;
content:"";
position:absolute;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
top:20px;
right:30px;
width:10px;
height:10px;
margin-top:-5px;
background:#f1f1f1;
}
.subnav > a:after {
display:block;
content:"";
position:absolute;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
top:20px;
right:30px;
width:10px;
height:10px;
margin-top:-10px;
background:#9b0f0f;
}
.subnav a:hover:after {
  background:#710000;
}

.active > a:before {
margin-top:0;
}
.active > a:after {
margin-top:5px;
}

.gnav {
display:none;
}

#spMenu {
display:block;
z-index:2;
position:fixed;
top:10px;
right:10px;
}
#spMenu:hover {
cursor:pointer;
}

#navBtn {
display:inline-block;
position:relative;
width:30px;
height:30px;
border-radius:5%;
background:#710000;
}
#navBtnIcon {
display:block;
position:absolute;
top:50%;
left:50%;
width:14px;
height:2px;
margin:-1px 0 0 -7px;
background:#f1f1f1;
transition:.2s;
}
#navBtnIcon:before,
#navBtnIcon:after {
display:block;
content:'';
position:absolute;
top:50%;
left:0;
width:14px;
height:2px;
background:#f1f1f1;
transition:0.3s;
}
#navBtnIcon:before {
margin-top:-6px;
}
#navBtnIcon:after {
margin-top:4px;
}
#navBtn .close {
background:transparent;
}
#navBtn .close:before,
#navBtn .close:after {
margin-top:0;
}
#navBtn .close:before {
transform:rotate(-45deg);
-webkit-transform:rotate(-45deg);
}
#navBtn .close:after {
transform:rotate(-135deg);
-webkit-transform:rotate(-135deg);
}

.col_two_one ul {
margin-right:0;
}
.col_two_one li {
width:100%;
}
.col_two_one li:nth-child(2n+1) {
clear:both;
}
}