@charset "utf-8";

/* clearfix
------------------------------------------------------------------------------*/
#naviMain:after,
#suLNavi:after,
#numberNavi:after,
#jpnNavi:after,
#engNavi:after,
#suMain .yogoOrder:after,
#yogoWantonym:after,
#yogoWrelation:after,
#yogoWlink:after,
#yogoWsynonym:after,
#yogoNotes:after {
	content:"";
	display:block;
	clear:both;
	height:0;
	visibility:hidden;
}
/* clearfix ie7
------------------------------------------------------------------------------*/
*:first-child+html #naviMain,
*:first-child+html #suLNavi,
*:first-child+html #numberNavi,
*:first-child+html #jpnNavi,
*:first-child+html #engNavi,
*:first-child+html #suMain .yogoOrder,
*:first-child+html #yogoWantonym,
*:first-child+html #yogoWrelation,
*:first-child+html #yogoWlink,
*:first-child+html #yogoWsynonym,
*:first-child+html #yogoNotes {
	zoom:1;
}
/* clearfix ie6
------------------------------------------------------------------------------*/
* html #naviMain,
* html #suLNavi,
* html #numberNavi,
* html #jpnNavi,
* html #engNavi,
* html #suMain,
* html #suMain .yogoOrder,
* html #yogoWantonym,
* html #yogoWrelation,
* html #yogoWlink,
* html #yogoWsynonym,
* html #yogoNotes {
	zoom:1;
}

/* 幅調整
------------------------------------------------------------------------------*/
body {
	font-size: 100%;
	font-family: "M PLUS 1", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}
#page,
#suHeader,
#suHeader #headNavi,
#suHLogo,
#suTopArea,
#suFooter {
	width: auto;
    color: #313131;
    line-height: 1.7;
}
#suFooter .linkArea {
	float: none;
	width: auto;
	min-width: auto;
	padding: 0 20px;
	text-align: center;
	font-size: 90%;
	line-height: 2;
}
#suFooter .linkArea a {
	display: inline-block;
}
#suFooter .iconArea {
	float: none;
	width: auto;
	text-align: center;
	margin-bottom: 10px;
}
#suFooter .iconArea .iconPMark {
    display: inline-block;
}
#suFooter .iconArea .iconIsp {
    display: inline-block;
}
#suFooter .iconArea p {
    float: none;
}

/* suHeader
------------------------------------------------------------------------------*/
#suHeader {
	float: none;
	margin: 0;
	text-align: left;
}
#headNavi {
	max-width: 860px;
	margin: 0 auto;
	}

/* suTopArea
------------------------------------------------------------------------------*/
#suTopArea {
	margin: 0 auto;
	padding: 10px 0 20px;
	box-shadow: 0 8px 5px -5px rgba(0, 0, 0, 0.3) inset;
}

#suTopArea #suPath {
	width: auto;
	max-width: 840px;
	line-height:1.3;
	padding:8px 20px;
	margin:0 auto;
	float: none;
	font-size: 14px;
}
#suTopArea #suPath a {
	display: inline-block;
}
#suTopArea #suQaNumber {
	float:right;
	width:160px;
	text-align:right;
	line-height:1.3;
	padding:8px 0;
	margin:0;
}
#suTopArea #suQaNumber a img {
	border:none;
	margin:0 8px 0 0;
	vertical-align:middle;
}
.p-solution-number {
	width: 840px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 12px;
	padding-right: 12px;
}
@media screen and (max-width: 767px) {
.p-solution-number {
	width: auto;
}
}
.p-solution-number .p-solution-number__label {
	float:right;
    display: inline-block;
    padding: 4px 8px;
    text-align: center;
    background-color: #fff;
    font-size: 12px;
    color: #1a3347;
    line-height: 1;
    border: 1px solid #b2bbc2;
    border-radius: 50px;
}

#suTopArea #suMembership {
	text-align:right;
	width:860px;
	display:block;
	padding:6px 0 10px 0;
}

/* suLNavi
------------------------------------------------------------------------------*/

#suLNavi {
	width: auto;
	height: auto;
	padding: 10px 10px 20px;
	margin: 60px 20px 0;
	background-color: #eee;
	border-radius: 10px;
}

* html #suLNavi {
	display: inline;
}

#suLNavi li a {
	display: block;
	height: 24px;
	text-indent: -7777px;
	background: url(/yogo/image/img_lnavi_off.png) no-repeat left top;
	overflow:hidden;
	outline:none;
}

#suLNavi li a:hover {
	background: url(/yogo/image/img_lnavi_on.png) no-repeat left top;
}

#suLNavi li div {
	display: block;
	height: 24px;
	text-indent: -7777px;
	background: url(/yogo/image/img_lnavi_none.png) no-repeat left top;
	overflow:hidden;
	outline:none;
}


/* numberNavi
------------------------------------------------------------------------------*/
#numberNavi {
	padding: 16px 0 0 29px;
	height: 32px;
}

#numberNavi #code {
	width: 98px;
	height: 24px;
	background-position: -29px -16px;
}


/* jpnNavi
------------------------------------------------------------------------------*/
#jpnNavi {
	padding: 9px 0 0 11px;
	height: auto;
}

#jpnNavi li {
	float: left;
	width: 24px;
	height: 24px;
	margin: 0 13px 13px 0;
}

#jpnNavi li.long {
	margin-right:32px;
}

/* engNavi
------------------------------------------------------------------------------*/
#engNavi {
	padding: 8px 0 0 11px;
	height: auto;
}

#engNavi li {
	float: left;
	width: 24px;
	height: 24px;
	margin: 0 13px 13px 0;
}

/* NaviButton
------------------------------------------------------------------------------*/
#jpnNavi #jpn_a { background-position: -11px -57px; }
#jpnNavi #jpn_i { background-position: -39px -57px; }
#jpnNavi #jpn_u { background-position: -67px -57px; }
#jpnNavi #jpn_e { background-position: -95px -57px; }
#jpnNavi #jpn_o { background-position: -123px -57px; }
#jpnNavi #jpn_ka { background-position: -11px -85px; }
#jpnNavi #jpn_ki { background-position: -39px -85px; }
#jpnNavi #jpn_ku { background-position: -67px -85px; }
#jpnNavi #jpn_ke { background-position: -95px -85px; }
#jpnNavi #jpn_ko { background-position: -123px -85px; }
#jpnNavi #jpn_sa { background-position: -11px -113px; }
#jpnNavi #jpn_si { background-position: -39px -113px; }
#jpnNavi #jpn_su { background-position: -67px -113px; }
#jpnNavi #jpn_se { background-position: -95px -113px; }
#jpnNavi #jpn_so { background-position: -123px -113px; }
#jpnNavi #jpn_ta { background-position: -11px -141px; }
#jpnNavi #jpn_ti { background-position: -39px -141px; }
#jpnNavi #jpn_tu { background-position: -67px -141px; }
#jpnNavi #jpn_te { background-position: -95px -141px; }
#jpnNavi #jpn_to { background-position: -123px -141px; }
#jpnNavi #jpn_na { background-position: -11px -169px; }
#jpnNavi #jpn_ni { background-position: -39px -169px; }
#jpnNavi #jpn_nu { background-position: -67px -169px; }
#jpnNavi #jpn_ne { background-position: -95px -169px; }
#jpnNavi #jpn_no { background-position: -123px -169px; }
#jpnNavi #jpn_ha { background-position: -11px -197px; }
#jpnNavi #jpn_hi { background-position: -39px -197px; }
#jpnNavi #jpn_fu { background-position: -67px -197px; }
#jpnNavi #jpn_he { background-position: -95px -197px; }
#jpnNavi #jpn_ho { background-position: -123px -197px; }
#jpnNavi #jpn_ma { background-position: -11px -225px; }
#jpnNavi #jpn_mi { background-position: -39px -225px; }
#jpnNavi #jpn_mu { background-position: -67px -225px; }
#jpnNavi #jpn_me { background-position: -95px -225px; }
#jpnNavi #jpn_mo { background-position: -123px -225px; }
#jpnNavi #jpn_ya { background-position: -11px -253px; }
#jpnNavi #jpn_yu { background-position: -67px -253px; }
#jpnNavi #jpn_yo { background-position: -123px -253px; }
#jpnNavi #jpn_ra { background-position: -11px -281px; }
#jpnNavi #jpn_ri { background-position: -39px -281px; }
#jpnNavi #jpn_ru { background-position: -67px -281px; }
#jpnNavi #jpn_re { background-position: -95px -281px; }
#jpnNavi #jpn_ro { background-position: -123px -281px; }
#jpnNavi #jpn_wa { background-position: -11px -309px; }
#engNavi #eng_a { background-position: -11px -351px; }
#engNavi #eng_b { background-position: -39px -351px; }
#engNavi #eng_c { background-position: -67px -351px; }
#engNavi #eng_d { background-position: -95px -351px; }
#engNavi #eng_e { background-position: -123px -351px; }
#engNavi #eng_f { background-position: -11px -379px; }
#engNavi #eng_g { background-position: -39px -379px; }
#engNavi #eng_h { background-position: -67px -379px; }
#engNavi #eng_i { background-position: -95px -379px; }
#engNavi #eng_j { background-position: -123px -379px; }
#engNavi #eng_k { background-position: -11px -407px; }
#engNavi #eng_l { background-position: -39px -407px; }
#engNavi #eng_m { background-position: -67px -407px; }
#engNavi #eng_n { background-position: -95px -407px; }
#engNavi #eng_o { background-position: -123px -407px; }
#engNavi #eng_p { background-position: -11px -435px; }
#engNavi #eng_q { background-position: -39px -435px; }
#engNavi #eng_r { background-position: -67px -435px; }
#engNavi #eng_s { background-position: -95px -435px; }
#engNavi #eng_t { background-position: -123px -435px; }
#engNavi #eng_u { background-position: -11px -463px; }
#engNavi #eng_v { background-position: -39px -463px; }
#engNavi #eng_w { background-position: -67px -463px; }
#engNavi #eng_x { background-position: -95px -463px; }
#engNavi #eng_y { background-position: -123px -463px; }
#engNavi #eng_z { background-position: -11px -491px; }

/* suMain
------------------------------------------------------------------------------*/
#suMain {
	width: auto;
	font-size:117%;
	margin-right: 10px;
}

* html #suMain {
	display: inline;
}

#suMain .dotline {
	background: url(/yogo/image/bg_bar.gif) no-repeat left top;
}

/* TopPage
------------------------------------------------------------------------------*/
#yogoTtl{
	width: 275px;
	height: 32px;
	text-indent: -7777px;
	background: url(/yogo/image/ti_yogo.png) no-repeat left top;
	position: relative;
	margin-bottom: 25px;
}

#suMain H2.Sttl {
	font-size: 117%;
	margin-left: 5px;
	padding: 2px 0 3px 16px;
	border-left: 10px solid #0077d9;
	border-bottom: 2px solid #0077d9;
}

#suMain .yogoOrder {
	padding: 20px 0 0;
}

#suMain .yogoOrder img {
	display: block;
	float: left;
	margin: 0 20px 0 0;
}

#suMain .TopTxt {
	padding: 20px 10px 35px;
}


/* ListPage
------------------------------------------------------------------------------*/
#yogoLTtl {
	font-size: 150%;
	height: 34px;
	line-height: 34px;
	margin: 0 0 0 5px;
    padding: 16px;
	background-color: #f0f1f3;
    border-radius: 16px;
}

* html #yogoLTtl {
	width: 515px;
}

#yogoList {
	list-style-type: none;
	margin: 0;
	padding: 30px 0 0;
}
#yogoList li {
	padding: 4px 0 4px 22px;
	background: url(/yogo/image/img_arrow.gif) no-repeat 10px center;
}

/* WordPage
------------------------------------------------------------------------------*/
#yogoWTtl {
	font-size: 150%;
	margin-left: 5px;
	padding: 0 0 10px 5px;
	border-bottom: 1px solid #0077d9;
}

#yogoWyomi {
	padding: 16px 0 0 10px;
	line-height: 140%;
}

#yogoWyomi dt {
	float: left;
	font-weight: bold;
}

#yogoWcomment {
	padding: 35px 0 0 10px;
}

#yogoWImg {
	padding: 20px 0 45px 10px;
}

#yogoWImg img {
	display: block;
	float: left;
	margin-bottom: 25px;
	max-width: 100%;
	height: auto;
}

#yogoWImg img.yogoLimg {
	margin-bottom: 0;
	margin-top: 30px;
}

#yogoWImg span.imgText{
	font-size: 90%;
	line-height: 1.2;
}

#yogoWantonym,
#yogoWrelation,
#yogoWlink,
#yogoWsynonym {
	padding: 15px;
}

#yogoWantonym p,
#yogoWrelation p,
#yogoWlink p,
#yogoWsynonym p {
	font-weight: bold;
}

#yogoWcomment,
#yogoWImg,
#yogoWantonym,
#yogoWrelation,
#yogoWlink,
#yogoWsynonym {
}

#yogoWantonym li,
#yogoWsynonym li,
#yogoWrelation li {
	display: block;
}

#yogoWantonym ul li,
#yogoWrelation ul li,
#yogoWlink ul li,
#yogoWsynonym ul li {
	padding-left: 10px;
	background: url(/yogo/image/img_arrow.gif) no-repeat left center;
}

/* #yogoNotes
------------------------------------------------------------------------------*/

#yogoNotes{
	margin: 40px 10px 0 10px;
	font-size: 110%;
}

#yogoNotes h2{
	font-size: 110%;
	padding: 3px 10px;
}

#yogoNotes p{
	margin-top: 10px;
}

#yogoNotes table{
	margin-top: 10px;
	width: 515px;
}

#yogoNotes table tbody tr th{
	border-bottom: 1px dotted #0077d9;
	border-top: 1px dotted #0077d9;
	font-weight: bold;
	padding: 7px;
	text-align: left;
	vertical-align: top;
	width: 50px;
}

#yogoNotes table tbody tr td{
	border-bottom: 1px dotted #0077d9;
	border-top: 1px dotted #0077d9;
	padding: 7px;
}

/* Web Safe Color
------------------------------------------------------------------------------*/
.box {
    display: flex
;
    width: 100%;
    overflow-x: scroll;
}

.box table {
    width: 90%;
    margin: 5px;
    flex-shrink: 0;
}

/* Web Safe Color
------------------------------------------------------------------------------*/

/* ミニアンケート配置変更ここから 20110303*/
#suMiniEnquete {
	margin-top:0px !important;
	font-size:120%;
}
#spacer {
	clear:both;
	display:block;
	height:40px;
}
/* ミニアンケート配置変更ここまで 20110303*/

/* レスポンシブ対応
------------------------------------------------------------------------------*/
#header-logo {
    width: auto;
    float: none;
}
#page {
	width: auto;
}
#contents {
	max-width: 900px;
	margin: 0 auto;
}
#suMain {
	float: none;
	margin: 0 20px;
}
#suFooter {
	max-width: 900px;
    margin: 60px auto;
}

#suMain .yogoOrder img {
    float: none;
    padding-bottom: 10px;
}

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

*:first-child+html .yogoNotes {
  zoom:1;
}

* html .yogoNotes {
  zoom:1;
}

.yogoNotes{
  margin: 40px 10px 0 10px;
  font-size: 100%;
}

.yogoNotes h2{
  font-size: 110%;
  padding: 20px 0;
}

.yogoNotes p{
  margin-top: 10px;
}

.yogoNotes table{
  margin-top: 10px;
}

.yogoNotes table tbody tr th{
  border-bottom: 1px dotted #0077d9;
  border-top: 1px dotted #0077d9;
  font-weight: bold;
  padding: 7px;
  text-align: left;
  vertical-align: top;
  width: 50px;
}

.yogoNotes table tbody tr td{
  border-bottom: 1px dotted #0077d9;
  border-top: 1px dotted #0077d9;
  padding: 7px;
}

.yogolist {
  list-style: none;
}
.yogolist li {
  padding-left: 1em;
  text-indent: -1em;
  background: none;
}

.yogolist li::before {
  content: "・";
}

.yogolist * {
  text-indent: initial;
}

.yogolist--hyphen li::before {
  content: "－";
}

.yogolist--note li::before {
  content: "※";
}

.yogoHosoku {
  padding: 15px;
}

.yogoHosoku--title {
  font-weight: bold;
}

.yogoHosoku--link li {
  padding-left: 10px;
  background: url(/yogo/image/img_arrow.gif) no-repeat left center;
}

.yogoHosoku img {
  padding-bottom: 10px;
}

.yogoWImg {
  padding: 20px 0 10px 10px;
}

.yogoWImg img {
  display: block;
  float: left;
  margin-bottom: 25px;
  max-width: 100%;
  height: auto;
}

.yogoWImg img.yogoLimg {
  margin-bottom: 0;
  margin-top: 30px;
}

.yogoWImg span.imgText{
  font-size: 90%;
  line-height: 1.2;
}

.yogoTxtPhrase {
  display: inline-block;
  text-decoration: inherit;
}