@charset "utf-8";
/****** CSS Document ******/

/*************************************************
reset
*************************************************/

* {
 margin: 0;
 padding: 0;
}

img {
 border: none;
}

body {
 font-size: 13px;
 color: #666666;
 line-height: 1.5em;
 font-family: "ＭＳ Ｐゴシック","Osaka","ヒラギノ角ゴ Pro W3",sans-serif;
 -webkit-text-size-adjust: 100%;
}

ul, ul li, ol, ol li {
list-style: none;
}

a {
 outline:none;
 color: #666666;
}

a:hover {
 text-decoration: none;
}


/*************************************************
common
*************************************************/

/******----------------------------------------------------------------------------------------------------------
※基準サイズは13pxです。

10px = 77%     11px = 85%   12px = 93%     13px = 100%     14px = 108%    15px = 116%    16px = 123.1%  17px = 131%
18px = 138.5%  19px = 146.5%  20px = 153.9%  21px = 161.6%   22px = 167%    23px = 174%    24px = 182%    25px = 189%
26px = 197%
-----------------------------------------------------------------------------------------------------------******/

/******** 見出し ********/

#main h1 {
 margin-bottom: 1em;
}

#main h2 {
 border-bottom: 1px solid #E8E065;
 padding-bottom: 0.2em;
 padding-left: 0.05em;
 margin-bottom: 1em;
}

#main h4 {
 font-size: 100%;
 color: #7F7F7F;
 margin-bottom: 0.8em;
}

#loginArea h2 {
 border-bottom: 1px solid #E8E065;
 padding-bottom: 0.2em;
 padding-left: 0.05em;
 margin-bottom: 0.4em;
}

/******** ヘッダー ********/

header h1#logoDff {
 float: left;
}

header h1#logoDff img {
 width: 100%;
 height: auto;
}

header ul.sns {
 float: right;
 padding-top: 4px;
}

header ul.sns li {
 float: left;
}

header ul.sns li#headerLogin {
 padding: 0 16px 0 0;
}

header ul.sns li.fbBtn {
 padding: 7px 16px 5px 16px;
 margin-right: 16px;
 width: 26px;
 border-right: #e6df65 1px solid;
}

header ul.sns li#sumaboSupporter {
 width: 78px;
}

header ul.sns li#sumaboSupporter img {
 width: 100%;
 padding-top: 5%;
}

header ul.sns li.twBtn {
 width: 32px;
}

header ul.sns li.fbBtn img {
 width: 100%;
}

header ul.sns li.twBtn img {
 width: 100%;
}

header .spSideMenu {
 display: none;
}

/******** コンテンツ ********/

#contents .toTop {
 margin-bottom: 25px;
 padding-right: 20px;
 float: right;
}

.contentsSubLv {
 padding-top: 20px;
}

#contents #main {
 padding: 25px 0 25px 0;
}

/******コンテンツ ログインエリア******/

#contents #loginArea #retureBtn {
 margin-bottom: 5%;
}

#contents #loginArea #retureBtn img {
 width: 100%;
}

#contents #loginArea #loginBlock {
 background-color: #E8E065;
 text-align: center;
 margin-bottom: 5%;
}

#contents #loginArea #loginBlock {
 padding-top: 5%;
 padding-bottom: 5%;
}

#contents #loginArea #loginBlock h3 {
 margin-bottom: 1.5%;
}

#contents #loginArea #loginBlock p.txt {
 margin-bottom: 3.2%;
}

#contents #loginArea #loginBlock h3 img, #contents #loginArea #loginBlock p.txt img {
 width: 95%;
}

#contents #loginArea #loginBlock p.btn img {
 width: 70%;
}

#contents #loginArea #loginBlock p.registBtn {
 margin-bottom: 1.2%;
}

#contents #loginArea #loginBlock {
 padding: 5%;
 margin-bottom: 2em;
}
 
#contents #loginArea #loginBlock .greeting {
 margin-bottom: 1.6em;
}

#contents #loginArea #loginBlock .greeting .name {
 float: left;
}

#contents #loginArea #loginBlock .greeting .logout {
 float: right;
 padding-left: 5px;
}

#contents #loginArea #loginBlock li span.txt {
 float: left;
}

#contents #loginArea #loginBlock li {
 margin-bottom: 0.8em;
}

#contents #loginArea #loginBlock li:last-child {
 margin-bottom: 0;
}

#contents #loginArea #loginBlock li span.icn {
 width: 14px;
 display: block;
 float: left;
 padding: 0.1em 0.4em 0 0;
}

#contents #loginArea #loginBlock li span.icn img {
 width: 100%;
}

#contents #loginArea #loginBlock li.subList li {
 float: left;
 margin-bottom: 0em;
}

#contents #loginArea #loginBlock li.subList li {
 width: 10em;
}

#contents ul.newsList .alart {
 color: #de1414;
}

#contents ul.newsList .alart span {
 color: #666666;
}


/******** フッター ********/

footer {
 background-color: #666666;
}

footer .upperFooter ul a {
 color: #E7DF65;
}

footer .upperFooter ul a:hover {
 text-decoration: none;
}

footer .upperFooter ul li {
 float: left;
 margin: 0 30px 4px 0;
}

footer .upperFooter ul li:last-child {
 margin-right: 0;
}

footer ul#annotation li {
 color: #FFF;
 font-size: 85%;
 line-height: 1.5em;
 padding-left: 1em;
 text-indent: -1em;
}


/******** テーブル ********/
table {
 border: 1px solid #CCCCCC;
 border-collapse: collapse;
 font-size: 100%;
 margin: 15px auto 5px;
 width: 98%;
}

table th, table td {
 border: 1px solid #CCCCCC;
 padding: 3px 4px;
}

table th {
 font-weight: normal;
 white-space: nowrap;
}

table thead th {
 background: none repeat scroll 0 0 #eeeeee;
 text-align: center;
}

table tr.center, table th.center, table td.center {
 text-align: center;
}

table tr.right, table th.right, table td.right {
 text-align: right;
}

table tr.left, table th.left, table td.left {
 text-align: left;
}

/******** テキストリンク ********/

.toTop {
 background: url(/img/common/icn_triangle_01.gif) left 0.3em no-repeat;
 padding-left: 1.5em;
}

.txtLink, .txtLinkList li {
 background: url(/img/common/icn_triangle_02.gif) left 0.3em no-repeat !important;
 padding-left: 1.5em;
}

/******** 別窓リンク ********/

.blankLink {
 width: 10px;
 display: block;
 float: right;
 padding-left: 3px;
}

.txtLinkBlank {
 width: 10px;
 display: inline-block;
 padding-left: 3px;
}

.blankLink img, .txtLinkBlank img {
 width: 100%;
}

/******** pdfリンク ********/

.pdfLink {
 background: url(/img/common/icn_pdf.gif) left 0.3em no-repeat;
 padding-left: 1.9em;
 line-height: 2em;
}

/******** 強調テキスト ********/

.arart, .arart a {
 color: #de1414 !important;
}

/******** PC版プロパティ ********/

@media screen and (min-width: 769px){
 header {
  padding: 12px 0 12px 24px;
 }
 
 header h1#logoDff { 
  width: 348px;
 }
 
 header .inner, footer .inner { 
  width: 100%;
 }

 header ul.sns {
  padding-right: 14px;
 }
 
 header #spMenuBtn {
  display: none;
 }
 
 #contents { 
  width: 100%;
 }
 
 #contents .innerMain {
  padding: 0 14px 0 24px;
  min-width: 980px;
 }

 #contents #main {
  width: 980px;
  float: left;
 }

 #contents #loginArea {
  width: 310px;
  float: right;
 }

 footer {
  padding: 14px 0 30px 24px;
 }
 
 .footerSubLv {
  padding-bottom: 3%;
 }

 footer .upperFooter {
  margin-bottom: 30px;
 }

 footer .inner .upperFooter p.sponsorBtn {
  width: 300px;
  float: right;
  padding-right: 20px;
 }
 
 footer .inner .upperFooter ul {
  margin-right: 345px;
 }
 
 *+html footer .upperFooter ul li {
  margin-right: 0px;
  width: 140px;
 }
 
 *+html footer .upperFooter ul li .blankLink {
  display: inline-block;
  float: none;
 }
 
 footer .upperFooter ul li {
  _margin-right: 0px;
  _width: 140px;
 }
 
 footer .upperFooter ul li .blankLink {
  _display: inline-block;
  _float: none;
 }
 
 footer .inner p.sponsorBtn img {
  width: 100%;
 }
 
}

/******** タブレット版プロパティ ********/

@media screen and (min-width: 641px) and (max-width: 768px) {
 header { 
  padding: 15px 16px 10px 16px;
 }
 
 header .inner { 
  max-width: 768px;
 }
 
 header h1#logoDff { 
  width: 300px;
 }

 header #spMenuBtn {
  display: none;
 }

 header ul.sns {
  font-size: 80%;
 }

 #contents { 
  max-width: 736px;
  padding: 0 16px 0 16px;
 }
 
 #contents .inner { 
  max-width: 768px;
 }
 
 #contents #main {
  width: 66.5%;
  float: left;
 }
 
 #contents #loginArea {
  width: 31%;
  float: right;
 }
 
 footer {
  max-width: 768px;
  padding: 14px 0 10px 0;
 }
 
 footer .upperFooter {
  margin-bottom: 1%;
 }

 footer .inner .upperFooter ul {
  width: 55%;
  float: left;
  padding-left: 14px;
 }

 footer .inner .upperFooter ul li {
  margin-bottom: 2%;
 }
 
 *+html footer .upperFooter ul li {
  margin-right: 0;
  width: 135px;
 }
 
 *+html footer .upperFooter ul li .blankLink {
  display: inline-block;
  float: none;
 }
 
 footer .upperFooter ul li {
  _margin-right: 0;
  _width: 135px;
 }
 
 footer .upperFooter ul li .blankLink {
  _display: inline-block;
  _float: none;
 }

 footer .inner .upperFooter p.sponsorBtn {
  width: 40%;
  float: right;
  padding-right: 14px;
 }
 
 footer .inner p.sponsorBtn img {
  width: 100%;
 }

}

/******** スマートフォン版プロパティ ********/

@media screen and (max-width: 640px){
 header { 
  padding: 14px 10px 10px 10px;
  position: relative;
 }
 
 header .inner { 
  max-width: 640px;
 }
 
 header h1#logoDff { 
  width: 200px;
 }
 
 header ul.sns li { 
  display: none;
 }
 
 header ul.sns { 
  padding-top: 12px;
 }
 
 header ul.sns li#headerLogin { 
  display: none;
 }
 
 header #spMenuBtn {
  position: absolute;
  right: 0;
  top: 0;
  width: 64px;
 }
 
 header #spMenuBtn img {
  width: 100%;
 }

 header .spSideMenu {
  padding: 50px 18px 0 18px;
 }
 
 header .inner .open {
  padding-top: 50px;
 }
 
 header .inner .close {
  padding-top: 50px;
 }

 header .spSideMenu ul.btn li {
  margin-bottom: 10%;
  float: none;
 }
 
 header .spSideMenu ul.btn li img {
  width: 100%;
 }
 
 header .spSideMenu #loginBlock {
  background-color: #E8E065;
  padding: 7%;
  margin-bottom: 2em;
  font-size: 85%;
 }
 
 header .spSideMenu #loginBlock .greeting {
  margin-bottom: 1.6em;
 }
 
 header .spSideMenu #loginBlock .greeting .name {
  float: left;
 }
 
 header .spSideMenu #loginBlock .greeting .logout {
  float: right;
 }
 
 header .spSideMenu #loginBlock ul {
  padding-top: 0;
 }
 
 header .spSideMenu #loginBlock li span.txt {
  float: left;
 }
 
 header .spSideMenu #loginBlock li {
  margin-bottom: 1em;
 }
 
 header .spSideMenu #loginBlock li:last-child {
  margin-bottom: 0;
 }
 
 header .spSideMenu #loginBlock li span.icn {
  width: 14px;
  display: block;
  float: left;
  padding: 0.1em 0.4em 0 0;
 }
 
 header .spSideMenu #loginBlock li span.icn img {
  width: 100%;
 }
 
 header .spSideMenu #loginBlock li.subList li {
  float: left;
  margin-bottom: 0.4em;
 }
 
 header .spSideMenu #loginBlock li.subList li {
  width: 10em;
 }
 
 #contents { 
  max-width: 620px;
  padding: 0 10px 0 10px;
 }
 
 #contents .inner { 
  max-width: 640px;
 }
 
 .contentsSubLv #main {
  padding-top: 30px!important;
 }
 
 #contents .loginAreaSubLv {
  display: none;
 }
 
 footer {
  padding: 15px 10px;
 }

 footer .upperFooter {
  margin-bottom: 1%;
 }

 footer .inner .upperFooter ul {
  margin-bottom: 6%;
 }

 footer .inner .upperFooter ul li {
  margin-bottom: 4%;
  margin-right: 5%;
 }
 
 *+html footer .upperFooter ul li {
  margin-right: 0;
  width: 140px;
 }
 
 *+html footer .upperFooter ul li .blankLink {
  display: inline-block;
  float: none;
 }
 
 footer .upperFooter ul li {
  _margin-right: 0;
  _width: 140px;
 }
 
 footer .upperFooter ul li .blankLink {
  _display: inline-block;
  _float: none;
 }
 
 footer .inner .upperFooter p.sponsorBtn {
  width: 80%;
  margin: 0 auto;
  margin-bottom: 8%;
 }
 
 footer .inner .upperFooter p.sponsorBtn img {
  width: 100%;
 }
 
 /****** Retinaディスプレイ対応 ******/
 
 #contents .toTop {
  background: url(/img/common/icn_triangle_sp_01.gif) left 0.3em no-repeat;
  background-size: 14px;
 }
 
 #contents .txtLink, #contents .txtLinkList li {
  background: url(/img/common/icn_triangle_sp_02.gif) left 0.3em no-repeat;
  background-size: 14px;
 }
 
 #contents .pdfLink {
  background: url(/img/common/icn_pdf_sp.gif) left 0.3em no-repeat;
  background-size: 17px;
 }
}


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

.clear, .clearfix {
 display: inline-table;
}

/****** mac \******/
*+html .clear, *+html .clearfix {
 height: 100%;
}

* html .clear, * html .clearfix {
 height: 1%;
}

.clear, .clearfix {
 display: block;
}