@charset "utf-8";




@media screen and (min-width:640px) {

* {
 line-height: 1.5;
 font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
}

body {
margin: 0px 0px 0px 0px;
/* background:#f1f1f1; */
text-align: center;
letter-spacing:1px;
background-color: #000;
/* background-image: url(img/bg.jpg); */

 /* 画像を常に天地左右の中央に配置 */
  background-position: center center;
   
  /* 画像をタイル状に繰り返し表示しない */
  background-repeat: no-repeat;
   
  /* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
  background-attachment: fixed;
   
  /* 表示するコンテナの大きさに基づいて、背景画像を調整 */
  background-size: cover;
   
  /* 背景画像が読み込まれる前に表示される背景のカラー */
  background-color: #464646;
}

li {
line-height:1.7em;
text-decoration:none;
}

.toppage {
    background: #28B463;
    color: #fff !important;
    padding: 13px;
    text-decoration: none;
    margin-top: 10em;
}

.toppage::before {
    content: "\f100";
    font-family: FontAwesome;
    font-size: 30px;
    vertical-align: sub;
    margin: 10px;
    text-decoration: none;
}


.page-navigation-list{
    list-style-type: none;
}
.page-navigation-next{
text-align:right;

}

.new::after{
  content:'';
  display: inline-block;
  width: 31px;
  height: 17px;
  margin-left:10px;
  background-repeat:no-repeat;
  background-image:url("/members/site/img/newicon.png");
  background-size: contain;
  vertical-align: middle;
}

.fas,
.far,
.fab{
margin-right:10px;
}

.center{
  display: block;
  margin: auto;
}


.scroll_area{
border:solid #999 1px;
}

.body {
  counter-reset: titleNum;
}



body.GSBackground{
	background-image: url(img/bg_gs.jpg);
}

a {
text-decoration: none;
font-weight:bold;
}

a:link {
color: #3b58af;
}

a:visited {
color: #3b58af;
}

a:active {
color: #FFFFFF;
}

a:hover {
color: #FF0000;
text-decoration:underline;
font-weight:bold;
}

a:hover{
opacity:0.8;
}

img{
 border:0;
 max-width: 100%;
}



h1, h2, h3 {
margin: 0px;
padding: 0px;
font-weight: normal;
}


/*ベースカラー*/
#container {
line-height: 140%;
width:1000px;
border:1px solid #666;
margin-right:auto;
margin-left:auto;
/*
background-image: url(./img/bg.jpg);
background-repeat: repeat-y;
*/
text-align: center;
background-color: #FFF;
background-repeat: no-repeat;
margin-top: 20px;
margin-bottom: 20px;
}

#leftBox{
margin-top: 0px;
width: 240px;
float: left;
font-size: 14px;
}

#leftPad{
padding: 10px;
}

#rightBox{
width: 750px;
float: right;

}

#rightPad{
padding: 15px;
}

.waku{
margin: 0px auto;
width: 720px;
text-align: left;
}

.waku h2 {
  padding: .5em .75em;
  background-color: #D4E6F1;
  border-left: 6px solid #5499C7;
margin-bottom:15px;
}

.waku h3 {
  position: relative;
  padding: .75em 1em;
  background-color: #D4E6F1;
}
h3::before,
h3::after {
  content: '';
  position: absolute;
  top: 100%;
  border-style: solid;
  border-color: transparent;
}
h3::before {
  left: 0;
  border-width: 0 15px 15px 0;
  border-right-color: #5499C7;
}
h3::after {
  right: 0;
  border-style: solid;
  border-width: 15px 15px 0 0;
  border-top-color: #5499C7;
}





/*バナー*/
#banner {
background-color: #FE0000;
height: 75px;
background-repeat: no-repeat;
background-position:top;
}

#banner h1 a {
        color: #fff;
        font-size: 30px;
        font-weight: bold;
        text-decoration: none;
}

/*タイトル文字*/
#banner h1 {
 font-size: 24px;
 font-weight: bold;
         color: #999;
         margin:0px;
padding:0px;
text-indent: -9000px;
}

/*サブタイトル文字*/
#banner h2 {
font-size:14px;
        font-weight: bold;
color: #FFFFFF;
padding: 5px 0px 0px 15px;
}
/*メイン*/


.description{
padding:0;
border:1px solid #999;
        border-top:0px solid #999;
background: #FAFAF3;
margin:0 15px 30px 15px;
        text-align:left;
        font-size:14px;
}

.description p{
        padding:10px;
        margin:0;
}

#center {
float: right;
width: 500px;
overflow: hidden;
        padding: 0 15px 0px 0px;
}

.content {
background-color: #FFFFFF;
text-align: left;
font-family: Verdana, Arial, sans-serif;
}

.content p {
color: #000000;
font-family: Verdana, Arial, sans-serif;
font-size: 14px;
line-height: 150%;
text-align: left;
}


.content h2 {
        font-size:16px;
        margin:20px 0 0px 0px;
        font-weight:bold;
        background:#FFF;
        color: #333;
        background-image: url(./img/mark.gif);
        background-position: left;
        background-repeat: no-repeat;
        padding: 0px 0px 0px 20px;
}

.content h3 {
        border-left:15px solid #000066;
        border-bottom:1px solid #000066;
color: #000;
font-family: Verdana, Arial, sans-serif;
font-size: 14px;
text-align: left;
font-weight: bold; 
margin: 0px 0px 10px 0px;
padding:1px 0 1px 10px;
background-color: #f8f8f8;
}

.content p.posted {
color: #999999;
font-family: Verdana, Arial, sans-serif;
font-size: x-small;
border-top: 1px solid #999999;
text-align: left;
        margin-bottom: 25px;
line-height: normal;
padding: 3px;
}

h2.lineh2{
color: #fff; 
background-image: none; 
background-color: #00C900; 
text-align: center; 
font-size: 25px;
margin-bottom: 0px;
padding-bottom: 20px;
border-left:none;
}

.lineBox{
border: 2px solid #00C900; padding: 15px;
}


.ctgy{
margin-left: 20px;
}

.ctgy dt{
        margin-bottom:0px;
margin-top: 20px;
        padding: 5px 0px 5px 20px;
        font-weight: bold;
        font-size: 18px;
        color:#333;
        background-image: url(./img/mark.gif);
        background-position: left;
        background-repeat: no-repeat;
}
.ctgy dt a:link { color: #666; }
.ctgy dt a:hover{ color:red; }
.ctgy dt a:visited{ color: #666; }

.ctgy dd{
        padding:0px 0px 0px 25px;
        margin-bottom: 5px;
}

.cat_list dt{
        background-image: url(./img/sankaku.gif);
        background-position: left;
        background-repeat: no-repeat;
        padding-left:20px;
}
.cat_list dd{
margin-bottom:20px;
}

.large{
        font-size:14px;
        font-weight:bold;
        margin-left:45px;
        margin-bottom:30px;
}

.entry-body{
        margin-left: 20px;
margin-bottom:100px;
}

/*サイド*/

#right {
float: left;
width: 245px;
overflow: hidden;
        margin-right:35px;
        border-right:1px solid #ddd;
        border-bottom:1px solid #999;
        background: #f8f8f8;
        text-align:left;
}

#right h2{
       background-color: #FFFFFF;
       font-size:14px;
       font-family:"HG創英角ｺﾞｼｯｸUB";
       font-weight:normal;
       text-align:center;
}


#right h3{
       font-size:14px;
       font-family:"HG創英角ｺﾞｼｯｸUB";
       font-weight:normal;
       text-align:center;
       background:#f8f8f8;
       border-top:3px solid #666;
       border-bottom:1px dashed #999;
       margin-left:0;
}

#right ul{
       padding-left:10px;
       font-size: 12px;
       margin:0 0 0 10px;
}





#powered {
       font-family: Verdana, Arial, sans-serif;
       font-size:12px;
       color: #7a818e;
       font-weight:normal;
       text-align:left;
       padding:20px 20px 7px 10px;
}

/*XML・検索のテキスト*/
.link-note {
font-family: Verdana, Arial, sans-serif;
font-size: 10px;
line-height: 150%;
text-align: right;
color: #1B2C3B;
margin-top: 3px;
margin-right:15px;
        position:absolute;
        top:80px; right:15px;
}

/* フッター */
#foot {
display: block;




background-color: #333
color: #fff;
font-size: 12px;
margin: 0;
height: 50px;
padding-top: 20px;
border-top: 1px solid #999;
text-align: center;
clear: both;

}

/* アドセンス */
.ads{
        padding:10px 0 10px 0;
        text-align:center;
}

.navi{
margin: 10px;
text-align: left;
font-size: 12px;
color: #999;
}

.navi a{
        color: #0000FF;
        font-size: small;
}
.navi a:visited {
        color: #0000FF;
        font-size: small;
}

.tbl table, 
.tbl tr, 
.tbl th, 
.tbl td{
border: 2px solid #000;
border-collapse: collapse;
font-size: 14px;
}

.tbl th, 
.tbl td{
padding: 2px 5px;
}

.tbl th{
background: #FFCC00;
}

.tbl td{
background: #fff;
color: #993300;
}

/**▼文字装飾*****/

/*赤文字*/
.rb{ color:#f00;}

/*下線*/
.uline{ text-decoration:underline;}

/*文字色背景を黄色*/
.yb{ background:#ff0;}

/*文字列を左寄せにする*/
.tl{ text-align:left;}

/*文字列を中央に配置*/
.tc{ text-align:center;}

/*文字列を右寄せにする*/
.tr{ text-align:right;}

/*画像を左に配置し、後に続く文字を右に回り込ませる*/
.left{
 float:left;
 margin:0 20px 0 0;
}

/*画像を右に配置し、後に続く文字を左に回り込ませる*/
.right{
 float:right;
 margin:0 0 0 20px;
}


/*回り込み解除*/
.c_both{ clear:both;}


.tmpl_tbl td{
vertical-align:top;
padding:20px;
border:1px solid #ccc;
}

.tmpl_tbl th{
vertical-align:top;
padding:5px 10px 20px 10px;
border:1px solid #ccc;
}

.tmpl_tbl a:hover{
text-decoration:none;
font-weight:bold;
color:#f00;
}

.tmpl_tbl img{
 border:1px solid #ddd;
}

.tmpl_tbl a:hover img {
opacity:0.8;
filter: alpha(opacity=80);
}

.ctgy table,td,th{
border:1px solid #999;
border-collapse:collapse;
font-size: 14px;
padding: 5px 10px;
}

.ctgy th{
 background:#ffe;
 width:170px;
 text-align:center;
}

.ctgy td{
 padding:5px;
 text-align:center;
}

.ctgy .cell001{
 text-align:left;
 font-weight:bold;
 white-space:nowrap;
}

.ctgy2 dt{
  font-size: 16px;
  border-bottom: 1px solid #ccc;
  margin-top: 20px;
}

.ctgy2 dd{
  font-size: 14px;
}

.answer{
border: 1px solid #FF9999;

padding: 15px;
margin: 10px;

}


.search{
  text-align: right;
  font-size: 14px;
  margin: 10px;
}

dt{
  font-weight: bold;
  border-bottom: 1px solid #ddd;
}

.ctgy2 dd{
  font-size: 14px;
　margin-bottom: 10px;
}
 
.waku_pad dl dd {
margin-bottom: 10px;
margin-left: 50px;
font-size: 14px;
}

.waku_pad dl dd .exp {
margin-left:40px
}

.qaPage table{
margin-bottom: 20px;
width: 100%;
}

.qaPage table,
.qaPage tr, 
.qaPage td {
  border-style:none;
  border-collapse: collapse;
  border-bottom: 1px solid #ddd;

}

.qaPage dd,
.qaPage a,
.qaPage li{
font-size: 14px;
}

.qaPage li {
list-style-type: none;
background-image: url(./img/q.jpg);
background-repeat: no-repeat;
background-position: left;
margin-left: 10px;
margin-top: 10px;
padding-left: 20px;
}

.qaPage dd {
background-image: url(./img/q.jpg);
background-repeat: no-repeat;
background-position: left 10px;
margin-left: 20px;
padding-left: 20px;
}

.qaPage td{
 padding: 5px;
 font-size: 14px;
 text-align: left;
}

td.faqsys {
border: none;
}

.update{
 font-size: 14px;
 color: red;
}

#koushin table{
border:none;
margin-left:10px;
}
#koushin table td{
border:none;
border-bottom:1px dotted #999;
}
h3{
padding-left:20px;
margin-bottom:10px;
}
.waku p{
padding-left:30px;
padding-right:30px;
}
.down a{
background-image:url(img/down_ic.jpg);
background-repeat:no-repeat;
padding-left:30px;
background-position: middle left;
}

h4 {
  position: relative;
  padding-bottom: .5em;
  border-bottom: 4px solid #ccc;
}
h4::after {
  position: absolute;
  bottom: -4px;
  left: 0;
  z-index: 2;
  content: '';
  width: 20%;
  height: 4px;
  background-color: #5499C7;
}


#leftPad ul{
margin:0;
padding: 5px;
}

#leftPad li{
list-style: none;
margin: 0;
padding: 0;
padding-top: 5px;
padding-bottom: 5px;
border-bottom: 1px solid #ddd;
}

dt{ padding:5px 10px;}
dd{ padding:5px 10px;}
dl{padding:5px 20px;}

a.btn_blue1,
a.btn_blue2,
a.btn_orange{
margin:0 auto;
display:block;
text-align:center;
text-decoration:none;
width:70%;
padding:20px;
border-radius:4px;
color:#fff;
font-weight:bold;
font-size:18px;
box-shadow:4px 4px #ccc;

}
.btn_box a strong{
font-size:24px;
line-height:1.4;
}

a.btn_blue1,
a.btn_blue2{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#5bbdff+2,33adff+100 */
background: rgb(91,189,255); /* Old browsers */
background: -moz-linear-gradient(top, rgb(91,189,255) 2%, rgb(51,173,255) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgb(91,189,255) 2%,rgb(51,173,255) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgb(91,189,255) 2%,rgb(51,173,255) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5bbdff', endColorstr='#33adff',GradientType=0 ); /* IE6-9 */
text-shadow:1px 0px 0px #0033CC;
}

a.btn_orange{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffa84c+0,ff7b0d+100;Orange+3D */
background: rgb(255,168,76); /* Old browsers */
background: -moz-linear-gradient(top, rgb(255,168,76) 0%, rgb(255,123,13) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgb(255,168,76) 0%,rgb(255,123,13) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgb(255,168,76) 0%,rgb(255,123,13) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa84c', endColorstr='#ff7b0d',GradientType=0 ); /* IE6-9 */
text-shadow:1px 0px 0px #FF3300;

}
a.btn_orange{
margin-top:20px;
}
a.btn_blue1{
margin-top:90px;
}
a.btn_blue2{
margin-top:20px;
}


.EntryList{
	width: 98%;
	border-bottom: 1px solid #ccc;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.EntryListImg{
	width: 30%;
	float: left;

}

.EntryListImg a img{
	max-width: 94%;
	margin: 0px;
}

.entry-detail{
	width:68%;
	font-size: 14px;
	float: left;
}

.entry-detail p{
	margin: 1em;
	padding: 0;
	margin-top: 0.5em;
}

.listHead a{
	font-size: 16px;
	font-weight: bold;
}


.EntryListCatName{
	background: #00CCFF;
	padding: 1em 10px;
	margin-top: 1.5em;
}

.EntryListCatName a{
	font-size: 20px;
	font-weight: bold;
	color: white;
}

.EntryListSubCatName{
	background: #FD6CB8;
	padding: 0.5em 10px 0.5em 20px;
	margin-top: 1.5em;

}
.EntryListSubCatName a{
	font-size: 18px;
	font-weight: bold;
	color: white;
}


figure{
margin: 2%;
padding: 0;
border: 0;
font-style: normal;
font-weight: normal;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}

}



@media screen and (max-width:480px) {
/* スマホ用 */


/*----------------------------------------------------
 リセット
----------------------------------------------------*/


html, body, div, span, applet, iframe, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
max-width:100%;
padding: 0;
border: 0;
font-style: normal;
font-weight: normal;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

html { overflow-y: scroll; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
}
input, textarea, {
margin: 0;
padding: 0;
}

#rightBox h2,
#rightBox h3{
font-weight: bold;
padding: 5px 10px;
margin: 1em auto;
}

#rightBox h2{
font-size: 20px;
border-bottom: 3px solid #990000;
}

#rightBox h3{
background: #ddd;
}

a {
margin: 0;
padding: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}

ol, ul { list-style: none; }

table {
border-collapse: collapse;
border-spacing: 0;
}

caption, th { text-align: left; }

a:focus { outline: none; }

img{ vertical-align:middle; }

img {
max-width: 100% ;
height:auto ;
}
ul, menu, dd, dir{
margin:0;
padding:0;
}
ul,ol{
margin:0;
-webkit-padding-start:0;
-moz-padding-start:0;
-o-padding-start:0;
-ms-padding-start:0;
}

@media screen and (max-width:600px) { 
iframe{
max-height:20
0px;
}
}





/*----------------------------------------------------
 共通
----------------------------------------------------*/


body {
font-family:'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
background:#fff;
font-size: 16px;
line-height: 1.6;
letter-spacing: 0;
-webkit-text-size-adjust : 100% ;
overflow:hidden;/* スクロール時横幅全体表示 */
}
a{
color:#A82222;
}

a:hover{
color:#E58F0E;
}

a:link {
color: #3b58af;
}

a:visited {
color: #3b58af;
}

a:active {
color: #FFFFFF;
}

a:hover {
color: #FF0000;
text-decoration:underline;
}

a:hover{
opacity:0.8;
}

/* IEイメージ枠なし */
a img {
border-style:none;
}

/*----------------------------------------------------
 contents
----------------------------------------------------*/



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

.main img{
text-align:center;
width:100%;
}

header{
padding: 0px;

}
header img{
width:100%;
}
header.pt2{
margin:0 auto;
}


.m_space{
margin-bottom:30px;
}

.m_space2{
margin-bottom:10px;
}
/*----------------------------------------------------
 form
----------------------------------------------------*/
.mail_box{
width:95%;
border:5px solid #000;
border-top:none;
margin:0 auto 20px;
text-align:center;
}

.mail_box2{
margin:0 auto 20px;
background:url(img/form_bg.png) repeat;
padding:20px;
}
s.mail_box3{
margin:20px auto ;
padding:5%;
width:80%;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d5cea6+0,c9c190+40,b7ad70+100;Brown+3D */
background: #d5cea6; /* Old browsers */
background: -moz-linear-gradient(top,  #d5cea6 0%, #c9c190 40%, #b7ad70 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #d5cea6 0%,#c9c190 40%,#b7ad70 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #d5cea6 0%,#c9c190 40%,#b7ad70 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d5cea6', endColorstr='#b7ad70',GradientType=0 ); /* IE6-9 */
border:10px solid #000;
}

.first{
margin:-50px auto 20px;
}

.mail_box .in,
.mail_box2 .in{
background:#F9DD17;
padding:20px;
border:5px solid #F90;
}

.mail_box .in p,
.mail_box2 .in p,
.mail_box3 .in p{
text-align:left;
}

.mail_box2 .in{
background-image:-moz-linear-gradient(rgb(255,255,255) 0%,rgb(229,231,236) 29%,rgb(206,212,221) 95%,rgb(206,212,221) 96%); 
background-image:-webkit-gradient(linear,color-stop(0, rgb(255,255,255)),color-stop(0.29, rgb(229,231,236)),color-stop(0.95, rgb(206,212,221)),color-stop(0.96, rgb(206,212,221)));
background-image:-webkit-linear-gradient(rgb(255,255,255) 0%,rgb(229,231,236) 29%,rgb(206,212,221) 95%,rgb(206,212,221) 96%);
background-image:-o-linear-gradient(rgb(255,255,255) 0%,rgb(229,231,236) 29%,rgb(206,212,221) 95%,rgb(206,212,221) 96%);
background-image:-ms-linear-gradient(rgb(255,255,255) 0%,rgb(229,231,236) 29%,rgb(206,212,221) 95%,rgb(206,212,221) 96%);
background-image:linear-gradient(rgb(255,255,255) 0%,rgb(229,231,236) 29%,rgb(206,212,221) 95%,rgb(206,212,221) 96%);
border-color:rgb(182,190,204);
border-width:1px;
border-style:solid;
-moz-box-shadow:inset 0px -14px 13px rgb(247,247,247) ,inset 0px -23px 0px rgb(192,200,211) ,inset 7px -16px 0px rgb(195,203,213) ,inset -2px -6px 0px rgb(192,200,211);
-webkit-box-shadow:inset 0px -14px 13px rgb(247,247,247) ,inset 0px -23px 0px rgb(192,200,211) ,inset 7px -16px 0px rgb(195,203,213) ,inset -2px -6px 0px rgb(192,200,211);
box-shadow:inset 0px -14px 13px rgb(247,247,247) ,inset 0px -23px 0px rgb(192,200,211) ,inset 7px -16px 0px rgb(195,203,213) ,inset -2px -6px 0px rgb(192,200,211);
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffffff,endColorstr=#ffced4dd)";
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffffff,endColorstr=#ffced4dd);
}
form{
margin:20px auto 0;
}



input.text{
width:90%;
margin:20px auto;
border:1px solid #F3C414;
padding-left:10px;
display:block;
height:40px;
border-radius:4px;
border:none;
font-size:16px;
font-family:'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
vertical-align:top;
color:#999;
}
.mail_box + ul,
.mail_box2 + ul,
.mail_box3 + ul{
background: #F1F1E3;
border: 1px solid #999;
color: #161416;
margin:0 auto 20px;
padding: 20px;
width: 80%;
}

.mail_box2 + ul{
background:#eee;
}

.mail_box + ul li,
.mail_box2 + ul li,
.mail_box3 + ul li{
text-align:left;
font-size:13px;
}
.mail_box + ul li.last,
.mail_box2 + ul li.last,
.mail_box3 + ul li.last{
margin:10px 0 0 0;
font-size:15px;
}
.mail_box + ul li a,
.mail_box2 + ul li a,
.mail_box3 + ul li a{
display:inline-block;
margin-left:5px;
}


/*----------------------------------------------------
 戻るボタン
----------------------------------------------------*/


.pagetop {
position:fixed;
right: 0;
bottom:150px;
}

.pagetop a{
display:block;
width:64px;
height:314px;
}

.pagetop a:hover img{
opacity:0.8;
}


/*----------------------------------------------------
 footer
----------------------------------------------------*/


footer {
position: relative;
width:100%;
bottom:0;
height:95px;
padding-top:20px;
background:#000;
color:#FFF;
text-align:center;

}

footer p{
margin:0 auto 20px;
font-size:16px;
}

footer small{
font-size:14px;
}



/*----------------------------------------------------
 clearfix
----------------------------------------------------*/

.clearfix:after {
content: "."; 
display: block;
clear: both;
height: 0;
visibility: hidden;

}

.clearfix {
min-height: 1px;
}

* html .clearfix {
height: 1px;
/*?*//*/
height: auto;
overflow: hidden;
/**/
}


#cnt{
padding:20px;
}

.cntbox{
margin:10px 0px;;
border:3px solid #F30;
padding:20px;
}

.tit{

background-image:-moz-linear-gradient(top, #009, #009);
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#009), to(#000066), color-stop(1,#000066));
color:#FFFFFF;
 border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */ 
padding:10px 20px;
 border-radius: 10px;        /* CSS3草案 */
-webkit-border-radius: 10px;    /* Safari,Google Chrome用 */
-moz-border-radius: 10px;   /* Firefox用 */
margin-bottom:10px;

}
.boxtit{
padding-left:10px;
border-bottom:2px solid #ccc;
font-weight: bold;
border-left:5px solid #F30;
margin-bottom:10px;

}
.waku{
padding:10px;
}


#foot{
text-align:center;
}

                                        

objectopen {
margin: 0 auto;
}
.objectopen input {
display: none;
}
.objectopen label {
color: #4776AF;
cursor: pointer;
padding: 0 10px;
}
.objectopen label:hover {
color: #ccc;
}
.objectopen .oo-cont1 {
padding: 0 10px;

}
.objectopen .oo-cont2 {
transition: 0.2s;
height: 0;
overflow: hidden;
padding: 0 10px;
}
.objectopen input:checked + .oo-cont2 {
height: auto;
padding: 10px;
}

.leftBox{
padding-bottom:20px;
}

}
                                          
.scroll_area {
overflow: scroll;
overflow-x: hidden;
height: 600px; 
}                                          

/* フラットボタン */
.square_btn {
    position: relative;
    display: block;
    font-weight: bold;
    padding: 1em 1em;
    text-decoration: none;
    color: #FFF;
 /*   background: #00bcd4; */
background: #660099;
    transition: .4s;
  }

.square_btn:hover {
    background: #1ec7bb;
}

.square_btn a,
.square_btn a:link,
.square_btn a:visited,
{
color: #fff;
}

.square_btn2 {
    position: relative;
    display: block;
    font-weight: bold;
    padding: 1em 1em;
    text-decoration: none;
    color: #FFF;
    /* background: #ff7f7f; */
background: #009933;
    transition: .4s;
  }

.square_btn2:hover {
    background: #1ec7bb;
}


.square_btn3 {
    position: relative;
    display: block;
    font-weight: bold;
    padding: 1em 1em;
    text-decoration: none;
    color: #FFF;
    /* background: #ff7f7f; */
background: #FF6600;
    transition: .4s;
  }

.square_btn3:hover {
    background: #FF9900;
}

.square_btn4 {
    position: relative;
    display: block;
    font-weight: bold;
    padding: 1em 1em;
    text-decoration: none;
    color: #FFF;
    /* background: #ff7f7f; */
background: #006699;
    transition: .4s;
  }

.square_btn5 {
    position: relative;
    display: block;
    font-weight: bold;
    padding: 1em 1em;
    text-decoration: none;
    color: #FFF;
    /* background: #ff7f7f; */
background: #c1a100;
    transition: .4s;
  }
                                      

.square_btn6 {
    position: relative;
    display: block;
    font-weight: bold;
    padding: 1em 1em;
    text-decoration: none;
    color: #FFF;
    /* background: #ff7f7f; */
background: #339933;
    transition: .4s;
  }

.square_btn6:hover {
    background: #1ec7bb;
}

.square_btn7 {
    position: relative;
    display: block;
    font-weight: bold;
    padding: 1em 1em;
    text-decoration: none;
    color: #FFF;
    /* background: #ff7f7f; */
background: #FF3333;
    transition: .4s;
  }

.square_btn7:hover {
    background: #1ec7bb;
}
                          
/* サイドメニュー */

#menu li{
                                    
  display: block;
  margin: 0;
  padding: 0; }

#menu li a{
  display: block;
  padding: 12px 0 10px;


  text-align: center;
  text-decoration: none;
}

#menu li a.updateMenu{
	background: #FFFFCC;
	font-weight: bold;
}

#menu li a:hover{
  background: #ddd;
}
#toggle{ 
 display: none;
}

#menu li.mail{
background: #FFFFCC;
padding: 15px auto;
}

#menu li.mail a{
display: inline;
}



@media only screen and (min-width: 630px) {
#menu li a{
padding: 15px auto;
}

#mailBtnSmart{
display: none;
}
#menu li{
    border-bottom: 1px solid #444;
}

#menu li.listtop{
border-top: 1px solid black;
}

.square_btn a,
.square_btn a:link,
.square_btn a:visited,
{
color: #fff;
}

.frameWidth{
width: 640px;
height: 360px;
}
}

@media only screen and (max-width: 480px) {
#mailBtnPC{
display: none;
}
  #menu{
    display: none;
  }
  #menu li{
    width: 100%;
border-bottom: 1px solid #ddd;
  }
#menu li a{
padding: 10px auto;
}
  #toggle{
    display: block;
    position: relative;
    width: 100%;
    background: #222;
  }
  #toggle a{
    display: block;
    position: relative;
    padding: 12px 0 10px;
    border-bottom: 1px solid #444;
    color: #fff;
    text-align: center;
    text-decoration: none;
  }
  #toggle:before{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    background: #fff;
  }
  #toggle a:before, #toggle a:after{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 4px;
    background: #222;
  }
  #toggle a:before{
    margin-top: -6px;
  }
  #toggle a:after{
    margin-top: 2px;
  }

h2.lineh2{
color: #fff; background-image: none; background-color: #00C900; text-align: center;
border-bottom: 0px solid #fff;
}

.lineBox{
border: 2px solid #00C900; padding: 15px;
}

.frameWidth{
width: 100%;
}

a.btn_blue1,
a.btn_blue2,
a.btn_orange{
margin:0 auto;
display:block;
text-align:center;
text-decoration:none;
width:70%;
padding:20px;
border-radius:4px;
color:#fff;
font-weight:bold;
font-size:18px;
box-shadow:4px 4px #ccc;

}
.btn_box a strong{
font-size:24px;
line-height:1.4;
}

a.btn_blue1,
a.btn_blue2{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#5bbdff+2,33adff+100 */
background: rgb(91,189,255); /* Old browsers */
background: -moz-linear-gradient(top, rgb(91,189,255) 2%, rgb(51,173,255) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgb(91,189,255) 2%,rgb(51,173,255) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgb(91,189,255) 2%,rgb(51,173,255) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5bbdff', endColorstr='#33adff',GradientType=0 ); /* IE6-9 */
text-shadow:1px 0px 0px #0033CC;
}

a.btn_orange{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffa84c+0,ff7b0d+100;Orange+3D */
background: rgb(255,168,76); /* Old browsers */
background: -moz-linear-gradient(top, rgb(255,168,76) 0%, rgb(255,123,13) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgb(255,168,76) 0%,rgb(255,123,13) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgb(255,168,76) 0%,rgb(255,123,13) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa84c', endColorstr='#ff7b0d',GradientType=0 ); /* IE6-9 */
text-shadow:1px 0px 0px #FF3300;

}
a.btn_orange{
margin-top:20px;
}
a.btn_blue1{
margin-top:90px;
}
a.btn_blue2{
margin-top:20px;
}

.EntryList{
	width: 96%;
	border-bottom: 1px solid #ccc;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.EntryListImg{
	width: 30%;
	float: left;
}

.EntryListImg img{
	max-width: 90%;
}

.entry-detail{
	width:68%;
	float: left;
}


.listHead a{
	font-size: 16px;
	font-weight: bold;
}


.EntryListCatName{
	background: #00CCFF;
	padding: 1em 10px;
}

.EntryListCatName a{
	font-size: 20px;
	font-weight: bold;
	color: white;
}

.qaPage table{
margin-bottom: 20px;
width: 100%;
}

.qaPage table,
.qaPage tr, 
.qaPage td {
  border-style:none;
  border-collapse: collapse;
  border-bottom: 1px solid #ddd;

}

.qaPage dd,
.qaPage a,
.qaPage li{
font-size: 16px;
}

.qaPage li {
list-style-type: none;
background-image: url(./img/q.jpg);
background-repeat: no-repeat;
background-position: left;
margin-left: 1em;
margin-top: 1em;
margin-bottom: 1em;
padding-left: 20px;
}

.qaPage dd {
background-image: url(./img/q.jpg);
background-repeat: no-repeat;
background-position: left 10px;
margin-left: 1em;
margin-top: 1em;
margin-bottom: 1em;
padding-left: 20px;
}

.qaPage td{
 padding: 5px;
 font-size: 14px;
 text-align: left;
}

dt{
  font-weight: bold;
  border-bottom: 1px solid #ddd;
}

}   


#pageTop {
  position: fixed;
  bottom: 20px;
  right: 20px;
}
 
#pageTop a {
  display: block;
  z-index: 999;
  padding: 8px 0 0 8px;
  border-radius: 30px;
  width: 35px;
  height: 35px;
  background-color: #9FD6D2;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
}
 
#pageTop a:hover {
  text-decoration: none;
  opacity: 0.7;
}             

.scroll_area p{
font-size: 14px;
margin: 0px;
}



/*教材一覧の目次*/

#Mokuji{
	margin: 1em;
	border: 1px solid #ccc;
	padding: 1em;
	background: #f8f8f8;
}

#Mokuji ul, 
#Mokuji ul li {
	margin: 0;
}

#Mokuji ul li{
	list-style-type: none;
	line-height: 1.8em;
}

#Mokuji .MokujiLiChild{
	margin-left: 2em;
}


@media screen and (max-width:480px) { 
iframe{
max-height:150px;
}

p {
padding:5px 0px;
}

a {
font-weight:bold;
}
}


.numlist {
  counter-increment: titleNum;
}

.numlist{
  position: relative;
  padding: 0.4em 2em .2em 3em;
  border-bottom: 1px solid #ccc;
}
.numlist::before{
  position: absolute;
  top: 3px;
  left: 2px;
  content: counter(titleNum);
  width: 28px;
  height: 28px;
  line-height: 30px;
  background-color: #27AE60;
  border-radius: 100%;
  color: #fff;
  font-size: 1em;
  text-align: center;
}

.category-btn img{
	margin:5px 0;
}