
@charset "utf-8";

/*PC*/
/* ---------------------------------
	Color palette
---------------------------------- */
/*Bg color*/
.bg-dodablue {
  background-color: #007fc3;
}

.bg-dodablue {
  background-color: #007fc3;
}

.bg-accentgreen {
  background-color: #99cf16;
}

.bg-blue {
  background-color: #0a50a1;
}

.bg-yellow {
  background-color: #ffcc00;
}

.bg-skyblue {
  background-color: #32bed2;
}

.bg-emerald {
  background-color: #00d2a0;
}

.bg-chromium {
  background-color: #ff8250;
}

.bg-orange {
  background-color: #ff5a00;
}

.bg-green {
  background-color: #00be00;
}

.bg-gray {
  background-color: #a0a08c;
}

.bg-lightblue {
  background-color: #aac8f0;
}

.bg-citron {
  background-color: #fff082;
}

.bg-ashblue {
  background-color: #d2f0f0;
}

.bg-apricot {
  background-color: #ffd296;
}

.bg-icegreen {
  background-color: #b4f0dc;
}

.bg-salmonpink {
  background-color: #ffc8be;
}

.bg-pastelgreen {
  background-color: #aae6aa;
}

.bg-lightgray {
  background-color: #c8c8b4;
}

.bg-lime {
  background-color: #dcff96;
}

/* doda5.0 Bg color */
.bg-FFFFFF {
  background-color: #ffffff;
}

.bg-FFF100 {
  background-color: #fff100;
}

.bg-F44360 {
  background-color: #f44360;
}

.bg-595757 {
  background-color: #595757;
}

.bg-3BB1E8 {
  background-color: #3bb1e8;
}

.bg-30B2EF {
  background-color: #30b2ef;
}

.bg-E6F4FD {
  background-color: #e6f4fd;
}

.bg-2CAB9F {
  background-color: #2cab9f;
}

.bg-32BED2 {
  background-color: #32bed2;
}

.bg-F1F6DA {
  background-color: #f1f6da;
}

.bg-EA545D {
  background-color: #ea545d;
}

.bg-FCEAEB {
  background-color: #fceaeb;
}

.bg-FEF4E5 {
  background-color: #fef4e5;
}

.bg-FFCD2D {
  background-color: #ffcd2d;
}

.bg-FFFCD1 {
  background-color: #fffcd1;
}

.bg-DCDDDD {
  background-color: #dcdddd;
}

.bg-60AB0F {
  background-color: #60ab0f;
}

.bg-FF5A00 {
  background-color: #ff5a00;
}

.bg-007FC3 {
  background-color: #007fc3;
}

/*text color*/
.txt-dodablue {
  color: #007fc3;
}

.txt-accentgreen {
  color: #99cf16;
}

.txt-blue {
  color: #0a50a1;
}

.txt-yellow {
  color: #ffcc00;
}

.txt-skyblue {
  color: #32bed2;
}

.txt-emerald {
  color: #00d2a0;
}

.txt-chromium {
  color: #ff8250;
}

.txt-orange {
  color: #ff5a00;
}

.txt-green {
  color: #00be00;
}

.txt-gray {
  color: #a0a08c;
}

.txt-lightblue {
  color: #aac8f0;
}

.txt-citron {
  color: #fff082;
}

.txt-ashblue {
  color: #d2f0f0;
}

.txt-apricot {
  color: #ffd296;
}

.txt-icegreen {
  color: #b4f0dc;
}

.txt-salmonpink {
  color: #ffc8be;
}

.txt-pastelgreen {
  color: #aae6aa;
}

.txt-lightgray {
  color: #c8c8b4;
}

.txt-lime {
  color: #dcff96;
}

/*doda5.0 text color*/
.txt-FFFFFF {
  color: #ffffff;
}

.txt-FFF100 {
  color: #fff100;
}

.txt-F44360 {
  color: #f44360;
}

.txt-595757 {
  color: #595757;
}

.txt-3BB1E8 {
  color: #3bb1e8;
}

.txt-30B2EF {
  color: #30b2ef;
}

.txt-E6F4FD {
  color: #e6f4fd;
}

.txt-2CAB9F {
  color: #2cab9f;
}

.txt-32BED2 {
  color: #32bed2;
}

.txt-F1F6DA {
  color: #f1f6da;
}

.txt-EA545D {
  color: #ea545d;
}

.txt-FCEAEB {
  color: #fceaeb;
}

.txt-FEF4E5 {
  color: #fef4e5;
}

.txt-FFCD2D {
  color: #ffcd2d;
}

.txt-FFFCD1 {
  color: #fffcd1;
}

.txt-DCDDDD {
  color: #dcdddd;
}

.txt-60AB0F {
  color: #60ab0f;
}

.txt-FF5A00 {
  color: #ff5a00;
}

.txt-007FC3 {
  color: #007fc3;
}

/* ---------------------------------
	Button
---------------------------------- */
[class^="btnTypeSD"] {
  border-radius: 8px;
  /* CSS3草案 */
  -webkit-border-radius: 8px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 8px;
  /* Firefox用 */
  cursor: pointer;
  display: block;
  font-size: 16px;
  height: 53px;
  line-height: 56px;
  /*text-align: center;*/
  padding-left: 10px;
  position: relative;
  width: 204px;
}

[class^="btnTypeSD"]:hover {
  text-decoration: none;
}

/*white*/
.btnTypeSD00 {
  font-weight: bold;
  background: #fff;
  border: solid 1px #cccccc;
  box-shadow: 0 1px 0 #cccccc;
}

.btnTypeSD00:link {
  color: #3d3d3d;
  text-decoration: none;
}

.btnTypeSD00:visited {
  color: #3d3d3d;
  text-decoration: none;
}

.btnTypeSD00:hover {
  background: #f7f7f7;
  text-decoration: none;
  border: solid 1px #adadad;
}

/*
.btnTypeSD00:active{
top: 1px;
box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 3px 0px inset;
}
*/
/*Basic size*/
[class^="btnTypeA"] {
  border-radius: 8px;
  /* CSS3草案 */
  -webkit-border-radius: 8px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 8px;
  /* Firefox用 */
  cursor: pointer;
  display: block;
  font-size: 18px;
  height: 53px;
  line-height: 56px;
  text-align: center;
  width: 392px;
}

[class^="btnTypeB"] {
  border-radius: 8px;
  /* CSS3草案 */
  -webkit-border-radius: 8px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 8px;
  /* Firefox用 */
  cursor: pointer;
  display: block;
  font-size: 18px;
  height: 53px;
  line-height: 56px;
  text-align: center;
  width: 576px;
}

[class^="btnTypeA"]:hover {
  text-decoration: none;
}

[class^="btnTypeB"]:hover {
  text-decoration: none;
}

/*orange*/
.btnTypeA01,
.btnTypeB01 {
  background: linear-gradient(#fd8331, #f60);
  color: #fff;
  font-weight: bold;
  text-decoration: none;
}

.btnTypeA01:link,
.btnTypeB01:link {
  color: #fff;
  text-decoration: none;
}

.btnTypeA01:visited,
.btnTypeB01:visited {
  color: #fff;
  text-decoration: none;
}

.btnTypeA01:hover,
.btnTypeB01:hover {
  background: #ff8340;
  color: #fff;
  text-decoration: none;
}

.inactive {
  background: #818181;
  pointer-events: none;
}

/*
.btnTypeA01:active,
.btnTypeB01:active {
  box-shadow: 0 1px 0 #ff944c , rgba(0, 0, 0, 0.16) 0px 2px 3px 0px inset;
  margin-top: 2px;
  height: 53px;
  position: relative;
  top: 2px;
}
*/
/*green*/
.btnTypeA02,
.btnTypeB02 {
  background: linear-gradient(#7dba3c, #60ab0f);
  color: #fff;
  font-weight: bold;
  text-decoration: none;
}

.btnTypeA02:link,
.btnTypeB02:link {
  color: #fff;
  text-decoration: none;
}

.btnTypeA02:visited,
.btnTypeB02:visited {
  color: #fff;
  text-decoration: none;
}

.btnTypeA02:hover,
.btnTypeB02:hover {
  background: #88c04b;
  color: #fff;
  text-decoration: none;
}

/*
.btnTypeA02:active,
.btnTypeB02:active {
  box-shadow: 0 1px 0 #9dc747, rgba(0, 0, 0, 0.16) 0px 2px 3px 0px inset;
  margin-top: 2px;
  height: 53px;
  position: relative;
  top: 2px;
}
*/
/* 2カラムテキスト+ボタン部分 20170523追加 */
.btnAreaTypeB {
  overflow: hidden;
}

.btnAreaTypeB.double {
  width: 810px;
  height: auto;
  margin: 10px auto;
}

.btnAreaTypeB.double:after {
  content: "";
  clear: both;
  display: block;
}

.btnAreaTypeB.double li {
  float: left;
  width: 365px;
  height: auto;
}

.btnAreaTypeB.double li:not(:last-child) {
  margin-right: 80px;
}

.btnAreaTypeB.double li a {
  width: 363px;
  height: 38px;
  line-height: 40px;
  font-size: 16px;
}

/* white 20170523追加 */
.btnTypeA03 {
  font-weight: bold;
  background: #fff;
  border: solid 1px #d6d6d6;
  /*box-shadow: 0 1px 0 #d6d6d6;*/
}

.btnTypeA03:link {
  color: #3d3d3d;
  text-decoration: none;
}

.btnTypeA03:visited {
  color: #3d3d3d;
  text-decoration: none;
}

.btnTypeA03:hover {
  background: #f5f5f5;
  text-decoration: none;
  border: solid 1px #d6d6d6;
}

/*
.btnTypeA03:active {
	top: 1px;
	box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 3px 0px inset;
}
*/
/* ---------------------------------
	Button set
---------------------------------- */
.btnAreaTypeA {
  margin-bottom: 20px;
}

/*Type01*/
.btnBox01 {
  border: 1px solid #cccccc;
  box-sizing: border-box;
  height: 118px;
  margin-bottom: 20px;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
}

.btnBox01.type01 {
  border-left: 6px solid #ff5a00;
}

.btnBox01.type02 {
  border-left: 6px solid #60ab0f;
}

.btnBox01 span {
  display: block;
}

.btnBox01:after {
  clear: both;
  content: ".";
  display: block;
  height: 0;
  visibility: hidden;
}

.btnBox01 dt {
  background: #f2f2f2;
  box-sizing: border-box;
  color: #222;
  float: left;
  font-size: 20px;
  font-weight: bold;
  height: 116px;
  line-height: 32px;
  padding: 25px 0 0 24px;
  width: 429px;
}

.btnBox01 dt.singleItem {
  padding: 40px 0 0 29px;
}

.btnBox01 dt.idt {
  text-indent: -5px;
}

.btnBox01 dd {
  box-sizing: border-box;
  float: left;
  padding: 29px 0 0 30px;
  width: 50%;
}

/*Type02*/
.btnBox02 {
  border: 1px solid #cccccc;
  box-sizing: border-box;
  height: 118px;
  margin-bottom: 20px;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
}

.btnBox02.type {
  border-left: 6px solid #007fc3;
}

.btnBox02 span {
  display: block;
}

.btnBox02:after {
  clear: both;
  content: ".";
  display: block;
  height: 0;
  visibility: hidden;
}

.btnBox02 dt {
  box-sizing: border-box;
  color: #007fc3;
  float: left;
  font-size: 21px;
  font-weight: bold;
  height: 116px;
  line-height: 37px;
  padding: 22px 0 0 29px;
  width: 429px;
}

.btnBox02 dt.singleItem {
  padding: 40px 0 0 29px;
}

.btnBox02 dt.idt {
  text-indent: -5px;
}

.btnBox02 dd {
  box-sizing: border-box;
  float: left;
  padding: 29px 0 0 30px;
  width: 50%;
}

/*Type02*/
.btnBox03 {
  border: 1px solid #cccccc;
  box-sizing: border-box;
  height: 118px;
  margin-bottom: 20px;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
}

.btnBox03.type {
  border-left: 6px solid #007fc3;
}

.btnBox03.type01 {
  border-left: 6px solid #ff5a00;
}

.btnBox03.type02 {
  border-left: 6px solid #60ab0f;
}

.btnBox03 span {
  display: block;
}

.btnBox03:after {
  clear: both;
  content: ".";
  display: block;
  height: 0;
  visibility: hidden;
}

.btnBox03 dt {
  background: #f2fcff;
  box-sizing: border-box;
  color: #007fc3;
  float: left;
  font-size: 20px;
  font-weight: bold;
  height: 116px;
  line-height: 32px;
  padding: 25px 0 0 24px;
  width: 429px;
}

.btnBox03 dt.singleItem {
  padding: 40px 0 0 29px;
}

.btnBox03 dt.idt {
  text-indent: -5px;
}

.btnBox03 dd {
  box-sizing: border-box;
  float: left;
  padding: 29px 0 0 30px;
  width: 50%;
}

/* ---------------------------------
	Headings
---------------------------------- */
/*primary*/
.heading {
  font-size: 20px;
  font-weight: bold;
  line-height: 1.4;
  margin-bottom: 20px;
}

/*other color*/
.heading.dodaB {
  color: #007fc3;
}

/*size*/
.heading.heading--small {
  font-size: 15px;
}

.heading.heading--large {
  font-size: 18px;
}

/*.heading .heading--annotation {
  font-weight: normal;
  margin-left: 20px;
}*/
.heading .inline {
  display: none;
}

/*no margin*/
.heading.mgB0 {
  margin-bottom: 0;
}

/*style*/
.heading.heading--line {
  border-left: 4px solid #007fc3;
  padding: 2px 0 2px 15px;
}

.heading.heading--underline {
  border-bottom: 3px solid #007fc3;
  padding-bottom: 2px;
}

.heading.heading--thick {
  background: #007fc3;
  color: #fff;
  padding: 11px 15px 11px 20px;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
}

/*sub 本文に使う時*/
.infoTitle {
  font-size: 15px;
}

.articleBox h3.heading {
  font-size: 18px;
  font-weight: bold;
  line-height: 1.4;
  margin-bottom: 10px;
}

.articleBox h3.heading.mgB0 {
  margin-bottom: 0;
}

.articleBox .heading.heading--underlinethin {
  border-bottom: 1px dotted #333;
  margin-bottom: 15px;
  padding-bottom: 2px;
}

/* ---------------------------------
	Container 要素を囲う枠
---------------------------------- */
.articleArea {
  margin-bottom: 30px;
}

.infoArea {
  padding: 16px 20px 16px;
  position: relative;
}

.infoArea .cvBtn {
  width: 392px;
  margin: 0 auto;
}

.tag {
  background: #999;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  left: -2px;
  line-height: 1em;
  padding: 2px 30px 0px;
  position: absolute;
  text-align: center;
  top: -2px;
}

/* ---------------------------------
	Text
---------------------------------- */
.articleBox {
}

/*テキスト、イメージを格納するBox*/
/* primary */
.articleBox h3,
.articleBox h4,
.articleBox p {
  font-size: 14px;
  line-height: 1.7;
}

.articleBox li,
.articleBox dt,
.articleBox dd {
  font-size: 14px;
  line-height: 1.7;
  /*line-height: 1.8;*/
}

.articleBox .txtSmall {
  font-size: 13px;
  line-height: 1.4;
}

.articleBox .txtLarge {
  font-size: 18px;
}

/* text間の余白 */
.articleBox .paragraph {
  margin-bottom: 20px;
}

.articleBox .paragraph.min {
  margin-bottom: 10px;
}

.articleBox .paragraph.line {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 20px;
  padding-bottom: 20px;
}

/* 本文用ラベル　色はbg指定で */
.articleBox .labels {
  padding: 2px 15px 0;
  margin-right: 10px;
}

/*強調指定（太字）*/
.txt--emphasis {
  font-weight: bold;
}

/*下線指定*/
.txt--underline {
  border-bottom: 1px dashed #777;
  padding-bottom: 2px;
}

/*警告等の指定（赤）*/
.txt--caution {
  color: #ff0000;
}

/*マーカー指定*/
.txt--marker {
  background-color: #ffff99;
}
em.txt--marker {
  font-style: normal;
  font-weight: 500;
}

/*注釈指定（15px⇒13px　グレー）*/
.articleBox .txt--annotation {
  color: #808080;
  line-height: 1.4;
}

/* ---------------------------------
	img--flat
---------------------------------- */
.img--flat {
  background: #fff;
  border: 1px solid #e6e6e6;
  padding: 10px 0;
  text-align: center;
}

.img--flat.noLine {
  border: none;
}

.img--flat.consecutive {
  margin-bottom: 30px;
}

.img--flat img {
  width: 620px;
}

.img--flat.middle img {
  padding: 10px 0;
  width: 540px;
}

.img--flat.mini img {
  padding: 10px 0;
  width: 320px;
}

/* 20170523追加 */
.img--flat--full {
  background: #fff;
  border: 1px solid #e6e6e6;
  text-align: center;
  box-sizing: border-box;
}

.img--flat--full img {
  width: 100%;
}

.img--flat--full.thickLine {
  border: 3px solid #e6e6e6;
}

.img--flat--full.noLine {
  border: none;
}

.img--flat--full.consecutive {
  margin-bottom: 30px;
}

/* ---------------------------------
	List style
---------------------------------- */
ul.listStyle {
  margin-left: 2em;
}

.listStyle {
  margin-left: 1.4em;
}

.listStyle li {
  margin-top: 0.5em;
  line-height: 1.8;
}

.listStyle li:first-child {
  margin-top: 0;
}

/* arrow */
.listStyle--arrow {
  position: relative;
}

.listStyle--arrow:after {
  border-right: 2px solid #007fc3;
  border-bottom: 2px solid #007fc3;
  content: "";
  display: block;
  height: 5px;
  left: -1.07em;
  position: absolute;
  top: 0.6em;
  transform: rotate(-45deg);
  width: 5px;
  -webkit-transform: rotate(-45deg);
}

/* dropdown */
.listStyle--dropdown {
  position: relative;
}

.listStyle--dropdown:after {
  border-right: 2px solid #007fc3;
  border-bottom: 2px solid #007fc3;
  content: "";
  display: block;
  height: 5px;
  left: -1em;
  position: absolute;
  top: 0.45em;
  transform: rotate(45deg);
  width: 5px;
  -webkit-transform: rotate(45deg);
}

/* circle */
.listStyle--circle {
  position: relative;
}

.listStyle--circle:after {
  background-color: #007fc3;
  border-radius: 100%;
  content: "";
  display: block;
  height: 5px;
  left: -1em;
  position: absolute;
  top: 0.6em;
  width: 5px;
}

/* circle色はclassを付与して指定する */
.circle-bg-dodablue:after {
  background-color: #007fc3;
}

.circle-bg-accentgreen:after {
  background-color: #99cf16;
}

/* circleの小さいサイズはclassを付与指定する 20170720追記 */
.listStyle--circle.styleSmall:after {
  width: 3px;
  height: 3px;
  top: 0.5em;
}

/* ---------------------------------
	Box style
---------------------------------- */
.boxStyle {
}

.boxStyle--bgGray {
  background: #f2f2f2;
}

.boxStyle--bgBlue {
  background: #e6f4fd;
}

.boxStyle--thinLine {
  background: #fff;
  border: 1px solid #e5e5e5;
}

.boxStyle--thinLine--bgGray {
  background: #f2f2f2;
  border: 1px solid #e5e5e5;
}

.boxStyle--thinLineDodablue {
  background: #fff;
  border: 1px solid #007fc3;
}

.boxStyle--line {
  background: #fff;
  border: 2px solid #e5e5e5;
}

.boxStyle--line--bgGray {
  background: #f2f2f2;
  border: 2px solid #e5e5e5;
}

.boxStyle--lineDodablue {
  background: #fff;
  border: 2px solid #007fc3;
}

.boxStyle--thickLine {
  background: #fff;
  border: 3px solid #e5e5e5;
}

.boxStyle--thickLine--bgGray {
  background: #f2f2f2;
  border: 3px solid #e5e5e5;
}

.boxStyle--thickLineDodablue {
  background: #fff;
  border: 3px solid #007fc3;
}

.boxStyle--thickLineDodablue--bgGray {
  background: #f2f2f2;
  border: 3px solid #007fc3;
}

/* ---------------------------------
	Box layout
---------------------------------- */
.boxLayout {
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 30px;
  overflow: hidden;
}

/* Boxs種類 */
.boxLayout.type01 {
  background: #f2f2f2;
  border: 1px solid #e5e5e5;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  box-shadow: 0px 3px #bfbfbf;
  -moz-box-shadow: 0px 3px #bfbfbf;
  -webkit-box-shadow: 0px 3px #bfbfbf;
  padding: 20px;
}

.boxLayout p {
  line-height: 1.6;
}

.boxLayout .img-small,
.boxLayout .img-medium,
.boxLayout .img-large {
  float: right;
  padding-left: 30px;
}

.boxLayout.img-l .img-small,
.boxLayout.img-l .img-medium,
.boxLayout.img-l .img-large {
  float: left;
  padding: 0 30px 0 0;
}

.boxLayout .img-small img {
  width: 200px;
}

.boxLayout .img-medium img {
  width: 300px;
}

.boxLayout .img-large img {
  width: 400px;
}

/*.boxLayout .txt { overflow: hidden;}*/
/* ---------------------------------
	Title
---------------------------------- */
.homeHero {
  border-bottom: 1px solid #e6e6e6;
  margin-bottom: 20px;
  position: relative;
}

.mainTitle {
  font-size: 28px;
  font-weight: bold;
  line-height: 1.5;
  margin-top: 20px;
  margin-bottom: 10px;
}

.mainTitle .titleSmall {
  font-size: 24px;
}

.subTitle {
  font-size: 18px;
  font-weight: bold;
  line-height: 1;
  margin: 20px 0 -10px;
}

.subTitle .stitleTag {
  background: #0a50a1;
  color: #fff;
  font-size: 14px;
  font-weight: normal;
  margin-right: 10px;
  padding: 2px 10px 0;
}

.caption {
  font-size: 14px;
  line-height: 1.7;
  margin-top: 10px;
}

.homeHero .imgPc {
  text-align: center;
}

.homeHero .imgSp {
  display: none;
}

/* 20170523追加 */
.homeHero.noLine {
  border-bottom: none;
}

.titleArea {
  position: relative;
  width: 100%;
  height: auto;
  margin-bottom: 20px;
}

.titleArea div {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: auto;
  height: 84px;
  text-align: center;
  line-height: 1.5;
  margin: auto;
  z-index: 2;
}

.titleArea div.bgGlow {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: auto;
  height: 0;
  -webkit-box-shadow: 0 0 60px 50px rgba(255, 255, 255, 0.9);
  /* Safari, Chrome用 */
  -moz-box-shadow: 0 0 60px 50px rgba(255, 255, 255, 0.9);
  /* Firefox用 */
  box-shadow: 0 0 60px 50px rgba(255, 255, 255, 0.9);
  /* CSS3 */
  z-index: 1;
}

.titleArea div.bgGlow.type01 {
  width: 400px;
}

.titleArea div.bgGlow.type02 {
  width: 480px;
}

.titleArea div.bgGlow.type03 {
  width: 510px;
}

.titleArea div.bgGlow.type04 {
  width: 540px;
}

.titleArea div.bgGlow.type05 {
  width: 650px;
}

.mainTitle.typeA {
  font-size: 40px;
  line-height: 1.5;
  margin: 0;
}

.subTitle.typeA {
  font-size: 24px;
  font-weight: normal;
  margin: 0;
}

/* Labels */
.label {
  font-size: 14px;
  left: 0;
  line-height: 1em;
  padding: 12px 15px 8px;
  position: absolute;
  top: 0;
}

.label.label--preparation {
  background: #ffc8be;
}

.label.label--resume {
  background: #ffd296;
}

.label.label--interview {
  background: #fff082;
  padding: 12px 20px 8px;
}

.label.label--joined {
  background: #dcff96;
}

.label.label--ranking {
  background: #aae6aa;
}

.label.label--column {
  background: #aac8f0;
}

.label.label--diagnosis {
  background: #d4ccf0;
}

/* 20170720追記 */
.label.label--syokureki {
  background-color: #d2f0f0;
}

.label.label--oubo {
  background: #b4f0dc;
}

/* 子ページタイトル */
.mainTitle.mainTitle--child {
  left: 20px;
  position: absolute;
  top: 70px;
}

.mainTitle.mainTitle--child .topics {
  background: #fff;
  border: 1px solid #007fc3;
  color: #007fc3;
  font-size: 13px;
  font-weight: normal;
  margin-left: 10px;
  padding: 5px 10px 3px;
}

.subTitle.subTitle--child {
  border-bottom: 2px solid #000;
  left: 20px;
  padding-bottom: 2px;
  position: absolute;
  top: 0;
}

.label--child {
  background: #007fc3;
  color: #fff;
  font-size: 13px;
  right: 0;
  line-height: 1em;
  padding: 8px 15px 6px;
  position: absolute;
  top: 0;
}

.label--child a {
  color: #fff;
  text-decoration: none;
}

.label--child a:hover {
  text-decoration: underline;
}

/* ---------------------------------
	Cards
---------------------------------- */
/*
.itemCard { overflow: hidden;}
.itemCard ul { margin-right: -9px;}
.itemCard li { float: left; width: 290px; border: 1px #e6e6e6 solid; margin: 0 9px 10px 0;}
.itemCard.large li { float: left; width: 439px; border: 1px #e6e6e6 solid; margin: 0 9px 10px 0;}
.itemCard li a { display: block; text-decoration: none;}
.itemCard ul li a:hover { opacity: 0.7;}
.itemCard li .boxInfo { position: relative; padding: 15px;}

.itemCard li .boxInfo .ttl {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 10px;
  padding-right: 58px;
  text-decoration: underline;
}

.itemCard li .boxInfo .txt { font-size: 14px;}
.itemCard li .boxInfo .ico { position: absolute; top: 15px; right: 15px;}
.itemCard li .boxInfo .ico img { width: 38px;}
.itemCard li .subtxt { font-size: 12px; padding-top: 10px}
*/
/* ---------------------------------
	Media
---------------------------------- */
.media {
  overflow: hidden;
}

.media li {
  float: left;
  margin: 0 18px 0 0;
  overflow: hidden;
  width: 435px;
}

.media li a {
  border-bottom: solid 1px #e6e6e6;
  box-sizing: border-box;
  display: block;
  overflow: hidden;
  padding: 20px 0;
}

.media li.even {
  margin-right: 0;
}

.media li .img {
  float: left;
  width: 60px;
}

.media li div {
  margin: 0 20px;
  width: 332px;
}

.media li div dl {
}

.media li div dl dt {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.4;
  padding-bottom: 10px;
}

.media li div dl dd {
  font-size: 15px;
}

.media li div dl dt:hover,
.media li div dl dd:hover {
  text-decoration: underline;
}

.media .media__flexLinkList li > a {
  display: flex;
}
/* ---------------------------------
	Media full
---------------------------------- */
.media {
  overflow: hidden;
}

.media.full li {
  float: left;
  margin: 0 18px 0 0;
  overflow: hidden;
  width: 888px;
}

.media.full li a {
  border-bottom: solid 1px #e6e6e6;
  box-sizing: border-box;
  /*display: block;*/
  overflow: hidden;
  padding: 20px 0;
}

/*
.media.full li a:hover {
background-color: #ebebf8;
}
*/
/*.media.full li.first a {
padding-top: 0;
}*/
.media.full li.even {
  margin-right: 0;
}

/*.media.full  ul li a:hover { opacity: 0.7;}*/
.media.full li .img {
  border: 1px solid #e6e6e6;
  float: left;
  width: 176px;
}

.media.full li div {
  float: left;
  margin: 0 20px 0 30px;
  width: 660px;
}

.media.full li div dl {
}

.media.full li div dl dt {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.4;
  padding-bottom: 10px;
}

.media.full li div dl dd {
  font-size: 14px;
}

.media.full li div dl dt:hover,
.media.full li div dl dd:hover {
  text-decoration: underline;
}

/* 見た目テキストを黒にする時 */
/*.media.full li div dl dt.plainTxt {
  color: #000;
}
.media.full li div dl dd.plainTxt {
color: #000;
}
*/
/* One column example in the box 20170523追加 */
.media.full--inBox li {
  float: none;
  width: 848px;
  margin: 0;
  overflow: hidden;
}

.media.full--inBox li:after {
  content: "";
  clear: both;
  display: block;
}

.media.full--inBox li dt {
  padding-bottom: 4px;
}

.media.full--inBox li a {
  display: inline-block;
  padding: 0;
  border-bottom: none;
}

.media.full--inBox li .img {
  float: left;
  width: 155px;
  border: 1px solid #e6e6e6;
}

.media.full--inBox li div {
  float: left;
  width: 662px;
  margin: 0 0 0 29px;
}

.media.full--inBox.noImg li div {
  float: none;
  width: 100%;
  margin: 0;
}

.media.full--inBox li div dl dd:hover {
  text-decoration: none;
}

.media.double--column ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.media.double--column li {
  padding: 20px 0;
  border-bottom: solid 1px #e6e6e6;
  box-sizing: border-box;
  overflow: hidden;
  width: calc(50% - 9px);
  height: auto !important;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
}

.media.double--column li a {
  display: inline;
  padding: 0;
  border-bottom: none;
  box-sizing: border-box;
  overflow: hidden;
}

.media.double--column.noImg li > a {
  flex: 1;
}

.media.double--column li dt {
  padding-bottom: 4px;
}

.media.double--column li dt a {
  display: inline-block;
}

.media.double--column li div dl dd:hover {
  text-decoration: none;
}

.media.double--column.noImg li div,
.media.double--column li.noImg div {
  float: none;
  width: 414px;
  margin: 0 21px 0 0;
  box-sizing: border-box;
}

/* media single--column 20170703追加 */
.media.single--column li {
  float: none;
  width: 888px;
  padding: 20px 0;
  margin: 0;
  border-bottom: solid 1px #e6e6e6;
  box-sizing: border-box;
  overflow: hidden;
}

.media.single--column li:after {
  content: "";
  clear: both;
  display: block;
}

.media.single--column li .img {
  float: left;
  width: 176px;
  border: 1px solid #e6e6e6;
  overflow: hidden;
}

.media.single--column li div {
  float: left;
  width: 660px;
  margin: 0 20px 0 30px;
}

.media.single--column li dt {
  padding-bottom: 4px;
}

.media.single--column li div dl dd {
  font-size: 14px;
}

.media.single--column li div dl dd:hover {
  text-decoration: none;
}

.media.single--column li a {
  display: inline-block;
  padding: 0;
  border-bottom: none;
}

/* ---------------------------------
	mediaBox
---------------------------------- */
.mediaBox {
  overflow: hidden;
}

.mediaBox.mediaBox--double {
  float: left;
  margin: 0 18px 0 0;
  width: 435px;
}

.mediaBox.mediaBox--double:nth-child(2) {
  margin: 0 0 0 0;
}

.mediaBox.mediaBox--double li {
  font-size: 13px;
  line-height: 1.8;
}

/* ---------------------------------
	column
---------------------------------- */
.column {
  overflow: hidden;
}

.column {
  margin-right: -18px;
}

.column.triple li {
  float: left;
  width: 284px;
  margin: 0 18px 20px 0;
}

.column.double li {
  float: left;
  width: 435px;
  margin: 0 18px 20px 0;
}

.column.double .img--flat img {
  width: 300px;
}

.column.triple .img--flat img {
  width: 200px;
}

/* ---------------------------------
	common
---------------------------------- */
/*a { text-decoration: none;}
a:hover { text-decoration: underline;}*/
/*4.1時には開放*/
/*
a,
a:link{
color:#0a50a1;
text-decoration: none;
}

a:visited{
color:#0a50a1;
text-decoration: none;
}
a:active,
a:focus{
text-decoration:none;
}
a:hover{
text-decoration:underline;
cursor: pointer;
}
*/
/* !img
---------------------------------------------------------- */
#container img {
  max-width: 100%;
  height: auto;
}

.pc_none {
  display: none;
}

.mgT0 {
  margin-top: 0 !important;
}

.mgT10 {
  margin-top: 10px;
}

.mgT20 {
  margin-top: 20px;
}

.mgT30 {
  margin-top: 30px;
}

.mgT40 {
  margin-top: 40px;
}

.mgT50 {
  margin-top: 50px;
}

.mgR0 {
  margin-right: 0 !important;
}

.mgR10 {
  margin-right: 10px;
}

.mgR20 {
  margin-right: 20px;
}

.mgR30 {
  margin-right: 30px;
}

.mgR40 {
  margin-right: 40px;
}

.mgR50 {
  margin-right: 50px;
}

.mgB0 {
  margin-bottom: 0 !important;
}

.mgB10 {
  margin-bottom: 10px;
}

.mgB20 {
  margin-bottom: 20px;
}

.mgB30 {
  margin-bottom: 30px;
}

.mgB40 {
  margin-bottom: 40px;
}

.mgB50 {
  margin-bottom: 50px;
}

.mgL0 {
  margin-left: 0 !important;
}

.mgL10 {
  margin-left: 10px;
}

.mgL20 {
  margin-left: 20px;
}

.mgL30 {
  margin-left: 30px;
}

.mgL40 {
  margin-left: 40px;
}

.mgL50 {
  margin-left: 50px;
}

.mgLRAuto {
  margin-left: auto !important;
  margin-right: auto !important;
}

.pdT10 {
  padding-top: 10px;
}

.pdT20 {
  padding-top: 20px;
}

.pdT30 {
  padding-top: 30px;
}

.pdT40 {
  padding-top: 40px;
}

.pdT50 {
  padding-top: 50px;
}

.pdR10 {
  padding-right: 10px;
}

.pdR20 {
  padding-right: 20px;
}

.pdR30 {
  padding-right: 30px;
}

.pdR40 {
  padding-right: 40px;
}

.pdR50 {
  padding-right: 50px;
}

.pdB10 {
  padding-bottom: 10px;
}

.pdB20 {
  padding-bottom: 20px;
}

.pdB30 {
  padding-bottom: 30px;
}

.pdB40 {
  padding-bottom: 40px;
}

.pdB50 {
  padding-bottom: 50px;
}

.pdL10 {
  padding-left: 10px;
}

.pdL20 {
  padding-left: 20px;
}

.pdL30 {
  padding-left: 30px;
}

.pdL40 {
  padding-left: 40px;
}

.pdL50 {
  padding-left: 50px;
}

/*table*/
.tableBase {
  background-color: #fff;
  border: #d9d9d9 solid;
  border-width: 1px 0 0 1px;
  font-size: 14px;
  line-height: 1.5;
  width: 100%;
}

.tableBase th,
.tableBase td {
  border: #d9d9d9 solid;
  border-width: 0 1px 1px 0;
  padding: 8px 10px;
  text-align: center;
  vertical-align: top;
}

.tableBase th {
  background-color: #ededed;
  font-size: 14px;
  font-weight: bold;
  padding: 5px;
}

.tableBase.bg--dodablue th {
  background-color: #007fc3;
  color: #fff;
}

.tableBase.bg--accentgreen th {
  background-color: #99cf16;
  color: #fff;
}

.tableBase.bg--blue th {
  background-color: #0a50a1;
  color: #fff;
}

.tableBase.bg--skyblue th {
  background-color: #32bed2;
  color: #fff;
}

.tableBase.bg--dodablue td,
.tableBase.bg-accentgreen td {
  background-color: #fff;
}

.tableBase th span {
  display: block;
  font-size: 10px;
}

/*tableセル縦中央*/
.tableBase.v-al-m th,
.tableBase td {
  vertical-align: middle;
}

/*table幅指定*/
.tableBase .w10 {
  width: 10%;
}

.tableBase .w15 {
  width: 15%;
}

.tableBase .w20 {
  width: 20%;
}

.tableBase .w25 {
  width: 25%;
}

.tableBase .w30 {
  width: 30%;
}

.tableBase .w35 {
  width: 35%;
}

.tableBase .w40 {
  width: 40%;
}

.tableBase .w45 {
  width: 45%;
}

.tableBase .w50 {
  width: 50%;
}

.tableBase .w55 {
  width: 55%;
}

.tableBase .w60 {
  width: 60%;
}

.tableBase .w65 {
  width: 65%;
}

.tableBase .w70 {
  width: 70%;
}

.tableBase .w75 {
  width: 75%;
}

.tableBase .w80 {
  width: 80%;
}

.tableBase .w85 {
  width: 85%;
}

.tableBase .w90 {
  width: 90%;
}

.tableBase .w95 {
  width: 95%;
}

.tableBase .w100 {
  width: 100%;
}

.tableBase.horizontal td {
  padding: 0;
}

.tableBase.horizontal td a {
  display: block;
  padding: 5px 20px;
  text-decoration: none;
  font-weight: bold;
  text-align: left;
}

.tableBase.horizontal td a:hover {
  background: #0a50a1;
  color: #fff;
}

/*リンクテキスト（右端）*/
.rightLink {
  font-size: 15px;
  padding: 10px 0;
  text-align: right;
}

/*リンクテキスト（左端）*/
.leftLink {
  font-size: 15px;
  padding: 10px 0;
  text-align: left;
}

/*リンクテキスト（中央）*/
.centerLink {
  font-size: 15px;
  padding: 10px 0;
  text-align: center;
}

/*リスト横並べ*/
.flowList {
  overflow: hidden;
}

.flowList li {
  float: left;
  line-height: 1.8;
  padding-right: 15px;
}

.flowList.type li {
  font-size: 13px;
}

/*バナーセンタリング*/
.bn658 {
  margin: 0 auto 50px;
  width: 658px;
}

.bn658.mgT30 {
  margin-top: 30px;
}

.bn658.mgT50 {
  margin-top: 50px;
}

/* ---------------------------------
	履歴書独自　後ほど別ファイルに移す
---------------------------------- */
/*a { text-decoration: none;}
a:hover { text-decoration: underline;}*/
/*4.1時には開放*/
.heading.bg-chromium {
  background-color: #ff8250;
}

.heading.bg-skyblue {
  background-color: #32bed2;
}

/* ---------------------------------
	Cards
---------------------------------- */
.itemCard {
  overflow: hidden;
}

.itemCard ul {
  margin-right: -28px;
}

.itemCard li {
  float: left;
  width: 288px;
  border: 1px #e6e6e6 solid;
  margin: 0 9px 10px 0;
  position: relative;
}

.itemCard.large li {
  float: left;
  width: 428px;
  border: 1px #e6e6e6 solid;
  margin: 0 28px 20px 0;
  position: relative;
}

.card--label {
  font-size: 12px;
  left: 0;
  line-height: 1em;
  padding: 8px 10px 8px;
  position: absolute;
  top: 0;
  background: #0a50a1;
  color: #fff;
}

.itemCard li a {
  color: #000;
  -webkit-box-shadow: 0 0 10px rgba(204, 204, 204, 0.6);
  -moz-box-shadow: 0 0 10px rgba(204, 204, 204, 0.6);
  box-shadow: 0 0 10px rgba(190, 190, 190, 0.6);
  display: block;
}

.itemCard ul li a:hover {
  background-color: #ebebf8;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  text-decoration: none;
  opacity: 0.7;
}

.itemCard li .box-info {
  position: relative;
  padding: 10px 15px 15px;
}

.itemCard.large li .box-info {
  position: relative;
  padding: 15px 20px 30px;
}

.itemCard li .box-info .ttl {
  font-size: 15px;
  font-weight: bold;
  line-height: 1.4;
  margin-bottom: 5px;
}

.itemCard.large li .box-info .ttl {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 5px;
}

.itemCard li .box-info .card-item-txt {
  font-size: 13px;
  line-height: 1.5;
}

.itemCard.large li .box-info .card-item-txt {
  font-size: 14px;
  line-height: 1.5;
}

.itemCard li .img.pdT10 {
  background: #fff;
  padding-top: 10px;
}

/* itemCard 20170703追加*/
.itemCard.link--text li a {
  color: #0a50a1;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  display: inline;
}

.itemCard.link--text ul li a:hover {
  background-color: #ffffff;
  text-decoration: underline;
  opacity: 1;
}

.itemCard.link--text--img li a {
  color: #0a50a1;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  display: inline;
}

.itemCard.link--text--img li .img {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.itemCard.link--text--img li .img .overlay {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  font-size: 11px;
  text-align: center;
  letter-spacing: 0.08em;
  color: #ffffff;
  background-color: rgba(16, 17, 119, 0.4);
  opacity: 0;
  z-index: 0;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

.itemCard.link--text--img li .img:hover > .overlay {
  opacity: 1;
  z-index: 2;
}

.itemCard.link--text--img li .img .overlay:before,
.itemCard.link--text--img li .img .overlay:after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 120px;
  margin-left: -60px;
  margin-top: -18px;
  border-top: 1px solid #ffffff;
  z-index: 1;
  -webkit-transform: scaleX(0);
  -moz-transition: scaleX(0);
  -ms-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -ms-transform: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

.itemCard.link--text--img li .img:hover .overlay:before,
.itemCard.link--text--img li .img:hover .overlay:after {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}

.itemCard.link--text--img li .img .overlay:before {
  margin-top: 18px;
}

.itemCard.link--text--img li .img .overlay span {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 120px;
  height: 36px;
  line-height: 39px;
  margin-left: -60px;
  margin-top: -18px;
}

.itemCard.link--text--img li .img:hover .overlay span:after {
  margin-right: 0px;
  opacity: 1;
}

.itemCard.link--text--img li .img a {
  display: block;
  z-index: 1;
}

.itemCard.link--text--img li .img a img {
  image-rendering: auto;
  image-rendering: pixelated;
  /* Chrome */
  -webkit-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  -ms-transition: all 0.1s ease;
  transition: all 0.1s ease;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

.itemCard.link--text--img li .img:hover a img {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05);
}

.itemCard.link--text--img ul li a:hover {
  background-color: #ffffff;
  text-decoration: underline;
  opacity: 1;
}

.box-anchor {
  overflow: hidden;
}

.btn-anchor {
  margin-right: -10px;
}

.btn-anchor li {
  float: left;
  margin: 0 10px 15px 0;
  width: 214px;
}

/*table*/
.tableBase.SD {
  background-color: #fff;
  border: #d9d9d9 solid;
  border-width: 1px 0 0 1px;
  font-size: 14px;
  line-height: 1.5;
  width: 100%;
}

.tableBase.SD th,
.tableBase.SD td {
  border: #d9d9d9 solid;
  border-width: 0 1px 1px 0;
  padding: 20px 20px;
  text-align: left;
}

.tableBase.SD th {
  background-color: #f7f7f7;
  font-size: 18px;
  font-weight: bold;
  padding: 20px;
  vertical-align: top;
}

.listSD li {
  font-size: 18px;
  line-height: 1.8;
}

.listStyleSD {
  margin-left: 1em;
}

/* arrow */
.listStyleSD.listStyle--arrow {
  position: relative;
}

.listStyleSD.listStyle--arrow:after {
  border-right: 2px solid #333;
  border-bottom: 2px solid #333;
  content: "";
  display: block;
  height: 6px;
  left: -1em;
  position: absolute;
  top: 0.55em;
  transform: rotate(-45deg);
  width: 6px;
  -webkit-transform: rotate(-45deg);
}

/**/
.stepList01 {
  height: 80px;
  overflow: hidden;
}

.stepList01 li {
  float: left;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  padding: 12px 0 8px;
  background: #ededfa;
  position: relative;
  height: 57px;
  line-height: 1.4;
  text-align: center;
}

.stepList01 li span {
  font-size: 13px;
}

.stepList01 li.step01:before,
.stepList01 li.step02:before,
.stepList01 li.step03:before,
.stepList01 li.step04:before,
.stepList01 li.step05:before {
  content: "";
  position: absolute;
  top: -2px;
  right: -22px;
  width: 0;
  height: 0;
  border-left: 20px solid #fff;
  border-top: 40px solid transparent;
  border-bottom: 40px solid transparent;
}

.stepList01 li.step01:after,
.stepList01 li.step02:after,
.stepList01 li.step03:after,
.stepList01 li.step04:after,
.stepList01 li.step05:after {
  content: "";
  position: absolute;
  top: -2px;
  right: -20px;
  width: 0;
  height: 0;
  border-left: 20px solid #ededfa;
  border-top: 40px solid transparent;
  border-bottom: 40px solid transparent;
}

.stepList01 li.step01 {
  width: 114px;
  padding-left: 10px;
  z-index: 5;
  background: #aac8f0;
}

.stepList01 li.step01 span {
  /*margin-left:8px;*/
}

.stepList01 li.step01:after {
  border-left: 20px solid #aac8f0;
}

.stepList01 li.step02 {
  width: 310px;
  padding-left: 20px;
  z-index: 4;
  background: #aae6aa;
}

.stepList01 li.step02 span {
  margin-left: 16px;
}

.stepList01 li.step02:after {
  border-left: 20px solid #aae6aa;
}

.stepList01 li.step03 {
  width: 154px;
  padding-left: 32px;
  z-index: 3;
  background: #fff082;
}

.stepList01 li.step03:after {
  border-left: 20px solid #fff082;
}

.stepList01 li.step04 {
  width: 118px;
  padding-left: 30px;
  z-index: 2;
  background: #ffd296;
}

.stepList01 li.step04:after {
  border-left: 20px solid #ffd296;
}

.stepList01 li.step05 {
  width: 55px;
  padding-left: 25px;
  z-index: 1;
  background: #ffc8be;
}

.stepList01 li.step05:after {
  border-left: 20px solid #ffc8be;
}

.stepList02 li.step01 {
  width: 100px;
  padding-left: 20px;
  z-index: 4;
}

.stepList02 li.step02 {
  width: 100px;
  padding-left: 10px;
  z-index: 3;
}

.stepList02 li.step03 {
  width: 100px;
  padding-left: 10px;
  z-index: 2;
}

.stepList02 li.step04 {
  width: 100px;
  padding-left: 10px;
  z-index: 1;
}

.stepList03 li.step01 {
  width: 100px;
  padding-left: 20px;
  z-index: 4;
}

.stepList03 li.step02 {
  width: 100px;
  padding-left: 10px;
  z-index: 3;
}

.heading.heading--thick.bg-lightblue {
  background: #aac8f0;
  color: #000;
}

.heading.heading--thick.bg-pastelgreen {
  background: #aae6aa;
  color: #000;
}

.heading.heading--thick.bg-citron {
  background: #fff082;
  color: #000;
}

.heading.heading--thick.bg-apricot {
  background: #ffd296;
  color: #000;
}

.heading.heading--thick.bg-salmonpink {
  background: #ffc8be;
  color: #000;
}

.boxStyle--thickLineLightblue--bg {
  background: #f0f6ff;
  border: 3px solid #aac8f0;
  border-top: none;
}

.boxStyle--thickLinePastelgreen--bg {
  background: #ebffeb;
  border: 3px solid #aae6aa;
  border-top: none;
}

.boxStyle--thickLineCitron--bg {
  background: #fffce5;
  border: 3px solid #fff082;
  border-top: none;
}

.boxStyle--thickLineApricot--bg {
  background: #fff4e5;
  border: 3px solid #ffd296;
  border-top: none;
}

.boxStyle--thickLineSalmonpink--bg {
  background: #fff;
  border: 3px solid #ffc8be;
  border-top: none;
}

/* 20170720追記 */
.boxStyle--leftLine {
  border-left: 6px solid #dddddd;
}

.boxStyle--leftLine h3 {
  font-size: 16px;
}

.boxStyle--leftLine h4,
.boxStyle--leftLine p,
.boxStyle--leftLine li {
  font-size: 13px;
}

.boxStyle--leftLine h4,
.boxStyle--leftLine p {
  margin-bottom: 5px;
}

.boxStyle--leftLine li {
  line-height: 1.4;
}

.sectionLine {
  border-bottom: 1px dotted #ccc;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.articleArea.enmanBG01,
.articleArea.enmanBG02,
.articleArea.enmanBG03,
.articleArea.enmanBG04 {
  position: relative;
  margin-bottom: 50px;
}

.articleArea.enmanBG01 .navi,
.articleArea.enmanBG02 .navi,
.articleArea.enmanBG03 .navi,
.articleArea.enmanBG04 .navi {
  width: 188px;
  position: absolute;
  bottom: -40px;
  left: 350px;
}

/**/
.col2Txt {
  background-color: #f2f2f2;
  padding: 20px 20px 5px;
  overflow: hidden;
}

.col2Txt li {
  display: block;
  width: 45%;
  padding-left: 10px;
  margin-bottom: 15px;
}

.col2Txt li:nth-child(odd) {
  float: left;
}

.col2Txt li:nth-child(even) {
  float: right;
}

/*あとで移す*/
.pict-graph img {
  width: 128px;
}

/* 転職求人倍率レポートindexページ追加分 */
/* ---------------------------------
  Media textonly
---------------------------------- */
.media {
  overflow: hidden;
}

.media.textonly li {
  float: left;
  margin: 0 18px 0 0;
  overflow: hidden;
  width: 426px;
}

.media.textonly li a {
  border-bottom: solid 1px #e6e6e6;
  box-sizing: border-box;
  display: block;
  overflow: hidden;
  padding: 20px 0;
  /*text-decoration: underline;*/
}

.media.textonly li .blankcell {
  border-bottom: solid 1px #e6e6e6;
  box-sizing: border-box;
  display: block;
  overflow: hidden;
  padding: 31px 0;
  /*text-decoration: underline;*/
}

.media.textonly li.even {
  margin-right: 0;
}

/*.media li a:hover { text-decoration: underline;}*/
.media.textonly li div {
  float: left;
  margin: 0 24px 0 10px;
  width: 410px;
}

.media.textonly li div dl {
}

.media.textonly li div dl dt {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.4;
  padding-bottom: 10px;
}

.media.textonly li div dl dd {
  font-size: 15px;
}

.media.textonly li div dl dt:hover,
.media.textonly li div dl dd:hover {
  text-decoration: underline;
}

/* guideTopLink 20170523追加 */
.guideTopLink {
  width: 280px;
  height: auto;
  margin: 0 auto;
}

.guideTopLink a {
  display: block;
  width: 285px;
  height: 50px;
  line-height: 50px;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  background-color: #ebebeb;
  border-radius: 6px;
}

.guideTopLink a:link {
  color: #333;
  text-decoration: none;
}

.guideTopLink a:visited {
  color: #333;
  text-decoration: none;
}

.guideTopLink a:hover {
  background: #f5f5f5;
  text-decoration: none;
}

/*.guideTopLink a:active {
	top: 1px;
	box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 3px 0px inset;
}
*/
/* アンカーリンクボタン（最大9まで想定） 20170523追加 */
.anchorBox {
  width: 888px;
  height: auto;
}

.anchorBox:after {
  content: "";
  clear: both;
  display: block;
}

.anchorBox.double li {
  float: left;
  width: 444px;
  height: 55px;
  text-align: left;
  border: 1px solid #cccccc;
  box-sizing: border-box;
}

.anchorBox.double li:not(:last-child):not(:nth-child(2n)) {
  border-right: none;
}

.anchorBox.double li:nth-child(n + 3):not(:nth-child(n + 10)) {
  border-top: none;
}

.anchorBox.double li span {
  display: table;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

.anchorBox.double li span a {
  display: table-cell;
  width: 100%;
  font-size: 14px;
  padding: 0 20px;
  vertical-align: middle;
  box-sizing: border-box;
}

.anchorBox.triple li {
  float: left;
  width: 296px;
  height: 55px;
  text-align: left;
  border: 1px solid #cccccc;
  box-sizing: border-box;
}

.anchorBox.triple li:not(:last-child):not(:nth-child(3n)) {
  border-right: none;
}

.anchorBox.triple li:nth-child(n + 4):not(:nth-child(n + 10)) {
  border-top: none;
}

.anchorBox.triple li span {
  display: table;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

.anchorBox.triple li span a {
  display: table-cell;
  width: 100%;
  font-size: 14px;
  padding: 0 20px;
  vertical-align: middle;
  box-sizing: border-box;
}

/* 20180810追加 */
/*--------------------------------------------------
  guideSummaryArea
--------------------------------------------------*/
.guideSummaryArea {
  position: relative;
  width: 100%;
  height: auto;
  margin: 0 auto 60px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

.guideSummaryArea .innerBox {
  position: relative;
  background-color: #24aae9;
  padding: 4px 4px 4px 225px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
}

.guideSummaryArea .innerBox p {
  position: absolute;
  top: 50%;
  left: 40px;
  color: #ffffff;
  font-size: 14px;
  font-weight: bold;
  line-height: 1em;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 1;
}

.guideSummaryArea .innerBox ul {
  background-color: #ffffff;
  padding: 3px 26px 3px 30px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
}

.guideSummaryArea .innerBox ul li {
  position: relative;
  color: #222222;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5;
  padding: 15px 0 13px 55px;
}

.guideSummaryArea .innerBox ul li:not(:first-child) {
  background-image: linear-gradient(
    to right,
    #cccccc,
    #cccccc 2px,
    transparent 2px,
    transparent 2px
  );
  background-size: 4px 1px;
  background-position: top;
  background-repeat: repeat-x;
}

.guideSummaryArea .innerBox ul li::before {
  content: "";
  position: absolute;
  top: 16px;
  left: 15px;
  width: 20px;
  height: 20px;
  background-image: url(/cmn_web/img/guide/age/2018first/zacked_together_check.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 20px auto;
  overflow: hidden;
}

/*--------------------------------------------------
  guideEditingPostscript
--------------------------------------------------*/
.guideEditingPostscript {
  position: relative;
  background-color: #30b2ef;
  padding: 0 4px 4px;
  margin-bottom: 50px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
}

.guideEditingPostscript::before {
  content: "";
  display: block;
  position: absolute;
  height: 160px;
  background-repeat: no-repeat;
  background-position: top 0 left 0;
  z-index: 0;
}

.guideEditingPostscript.illustration01::before {
  top: -50px;
  right: 30px;
  width: 100px;
  background-image: url(/cmn_web/img/guide/cyousatai_illustration_01.png);
  background-size: 100px auto;
}

.guideEditingPostscript.illustration02::before {
  top: -46px;
  right: 30px;
  width: 138px;
  background-image: url(/cmn_web/img/guide/cyousatai_illustration_02.png);
  background-size: 138px auto;
}

.guideEditingPostscript.illustration03::before {
  top: -46px;
  right: 30px;
  width: 85px;
  background-image: url(/cmn_web/img/guide/cyousatai_illustration_03.png);
  background-size: 85px auto;
}

.guideEditingPostscript h2 {
  display: inline-block;
  color: #ffffff;
  font-size: 20px;
  font-weight: bold;
  line-height: 1em;
  border-bottom: 4px solid #fff100;
  padding-bottom: 8px;
  margin: 29px auto 28px 26px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

.guideEditingPostscript .innerBox {
  position: relative;
  background-color: #ffffff;
  padding: 24px 26px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  z-index: 1;
}

.guideEditingPostscript .innerBox .textArea {
  width: 100%;
  height: auto;
}

.guideEditingPostscript .innerBox .textArea p {
  color: #222222;
  font-size: 14px;
  line-height: 1.7;
}

/*--------------------------------------------------
  guideOverviewArea
--------------------------------------------------*/
.guideOverviewArea {
  width: 100%;
  height: auto;
  margin-bottom: 50px;
}

.guideOverviewArea h3 {
  color: #808080;
  font-size: 12px;
  font-weight: bold;
  line-height: 1em;
  margin-bottom: 12px;
}

.guideOverviewArea p {
  color: #808080;
  font-size: 11px;
  line-height: 1.5;
}

.guideOverviewArea p:not(:last-child) {
  margin-bottom: 10px;
}

/*--------------------------------------------------
  guideBackNumber
--------------------------------------------------*/
.guideBackNumber {
  width: 100%;
  height: auto;
  margin-bottom: 40px;
}

.guideBackNumber h3 {
  color: #808080;
  font-size: 14px;
  font-weight: bold;
  line-height: 1em;
  margin-bottom: 12px;
}

.guideBackNumber p {
  color: #aaaaaa;
  font-size: 15px;
  line-height: 1.5;
}

.guideBackNumber p a {
  color: #0a50a1;
  font-size: 12px;
}

.guideBackNumber p a:hover {
  text-decoration: underline;
}

/*--------------------------------------
 topHeader
----------------------------------------*/
#topHeader {
  position: relative;
  height: auto;
}

#topHeader > img {
  display: block;
  margin: 0 auto;
}

#breadcrumb {
  width: 1200px;
  margin: 0 auto;
}

/*-----------------------------------------------------------------
  5.0リニューアル対応追加分
-----------------------------------------------------------------*/
/*--------------------------------------------------
  転職クイズコンテンツ
--------------------------------------------------*/
.disnone {
  display: none;
}

/* quizbox
----------------------------------------*/
.quizbox,
.answerArea .answer {
  position: relative;
  width: 99%;
  height: 430px;
  background-color: #ffffff;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.15);
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
  overflow: hidden;
}

.quizbox .quizTitleArea,
.answerArea .answerTitleArea {
  position: relative;
  width: 100%;
  height: auto;
}

.quizbox img,
.answerArea img {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: top;
}

.quizbox .quizTitleArea .quizTitle,
.answerArea .answerTitleArea .answerTitle {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 144px;
  height: 68px;
  color: #ffffff;
  font-size: 27px;
  font-weight: bold;
  line-height: 1.2;
  text-align: center;
  margin: auto;
}

.quizbox .quizTitleArea .quizTitle span,
.answerArea .answerTitleArea .answerTitle span {
  font-size: 17px;
}

.quizbox .quizTextArea {
  position: relative;
  height: 170px;
  margin: 0 34px;
}

.quizbox .quizText {
  position: absolute;
  top: 50%;
  left: 0;
  color: #222222;
  font-size: 18px;
  line-height: 1.9;
  text-align: left;
  word-wrap: break-word;
  padding-top: 40px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
}

.quizbox .quizText::before {
  content: "";
  display: block;
  position: absolute;
  top: 10px;
  left: 0;
  width: 25px;
  height: 25px;
  background-image: url(https://doda.jp/cmn_web/img/guide/index/sidequiz_q.png);
  background-repeat: no-repeat;
  background-size: 25px auto;
  background-position: center center;
}

.quizbox .btnArea {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: auto;
}

.quizbox .btnArea .abutton {
  display: block;
  width: 246px;
  height: 50px;
  color: #ffffff;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  background-color: #ffffff;
  padding: 2px 5px 0;
  margin: 0 auto;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  outline: none;
  appearance: none;
}

.quizbox .btnArea .abutton:nth-child(1) {
  color: #eea199;
  border: 1px solid #f19ec2;
  margin-bottom: 20px;
}

.quizbox .btnArea .abutton:nth-child(2) {
  color: #59b5f2;
  border: 1px solid #7ecef4;
  margin-bottom: 30px;
}

.quizbox .btnArea .abutton:hover {
  background-color: #fffcd1;
}

/* answerArea
----------------------------------------*/
.answerArea .answerImg {
  position: relative;
  width: 120px;
  height: 120px;
  margin: 20px auto;
  overflow: hidden;
}

.answerArea .answerImg img {
  position: absolute;
  top: 0;
  width: 240px;
}

.answerArea .correctA .answerImg img {
  left: 0;
}

.answerArea .losingA .answerImg img {
  right: 0;
}

.answerArea .answerText {
  position: relative;
  height: 90px;
  color: #222222;
  font-size: 14px;
  line-height: 1.6;
  text-align: left;
  word-wrap: break-word;
  margin: 0 21px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
}

.answerArea .btnArea {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: auto;
}

.answerArea .btnArea a {
  display: block;
  width: 246px;
  height: auto;
  margin: 0 auto 30px;
  text-decoration: none;
}

.answerArea .btnArea button {
  display: block;
  width: 100%;
  height: 50px;
  color: #2088c7;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  background-color: #ffffff;
  border: 1px solid #007fc3;
  padding: 2px 5px 0;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  outline: none;
  appearance: none;
}

.answerArea .btnArea button:hover {
  background-color: #f2fcff;
}

/*--------------------------------------------------
  guideLayoutAside
--------------------------------------------------*/
.guideLayoutAside {
  margin-bottom: 20px;
}

.guideLayoutAside.memberArea {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  border-radius: 6px;
  width: 285px;
}

/*--------------------------------------------------
  memberRegistrationBtnArea
--------------------------------------------------*/
.memberRegistrationBtnArea {
  padding: 25px;
  background: #fff;
  border-radius: 6px;
  border: 1px solid #e6e6e6;
}

.memberRegistrationSucBtnArea {
  background-color: #fff;
  padding: 25px;
  font-size: 12px;
  border-radius: 0px 0px 6px 6px;
}

.memberRegistrationSubText {
  color: #fe6e0f;
  font-weight: bold;
  font-size: 14px;
  text-align: center;
  margin-bottom: 15px;
}

.memberRegistrationText {
  font-size: 13px;
  text-align: center;
  line-height: 17px;
  font-weight: bold;
  margin-bottom: 15px;
}

.memberRegistrationSubBtn {
  border-radius: 6px;
  border: 1px solid #d6d6d6;
}

.memberRegistrationSubBtn:first-child {
  margin-bottom: 15px;
}

.counterNo {
  font-weight: normal;
  display: inline-block;
  margin-top: 2px;
}

.memberRegistrationSubBtn .memberRegistrationSubLink {
  text-align: center;
  color: #333333;
  font-weight: bold;
  margin: 0px auto;
  display: block;
  padding: 12px 0px;
}

.memberRegistrationBtnArea .memberRegistrationBtn {
  width: 100%;
  height: auto;
}

.memberRegistrationBtnArea .memberRegistrationBtn a {
  display: block;
  width: 228px;
  height: 50px;
  color: #ffffff;
  font-size: 16px;
  font-weight: bold;
  line-height: 50px;
  text-decoration: none;
  text-align: center;
  background: linear-gradient(#fd8331, #f60);
  margin: 0 auto;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
}

.memberRegistrationBtnArea .memberRegistrationBtn a:hover {
  background: linear-gradient(#fda164, #ff8c40);
}

.memberRegistrationBtnArea .memberRegistrationBtn a span {
  font-size: 12px;
  margin-left: 0.5em;
}

.memberRegistrationBtnArea .guideLoginText {
  color: #808080;
  font-size: 11px;
  text-align: center;
  margin: 10px 0px 0px;
}

.memberRegistrationBtnArea .guideForFirst {
  margin-top: 12px;
}

.memberRegistrationBtnArea .guideForFirst a {
  display: block;
  height: 30px;
  color: #000000;
  font-size: 12px;
  line-height: 28px;
  text-align: center;
  text-decoration: none;
  border: 1px solid #d6d6d6;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

/*--------------------------------------------------
  resumeCurriculumSampleList
--------------------------------------------------*/
.resumeCurriculumSampleList {
  background-color: #ffffff;
  border: 1px solid #e6e6e6;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
  overflow: hidden;
}

.resumeCurriculumSampleList ul {
  border-top: 4px solid #59aadd;
}

.resumeCurriculumSampleList ul li {
  width: 100%;
  height: auto;
  margin: 0;
}

.resumeCurriculumSampleList ul li:not(:last-child) {
  border-bottom: 1px solid #e6e6e6;
}

.resumeCurriculumSampleList ul li a {
  display: block;
  position: relative;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.5;
  background-color: #ffffff;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

.resumeCurriculumSampleList ul li:hover {
  text-decoration: underline;
}

.resumeCurriculumSampleList ul li.resumeSample a,
.resumeCurriculumSampleList ul li.curriculumSample a {
  padding: 35px 40px 34px 80px;
}

.resumeCurriculumSampleList ul li.curriculumCreateTool a {
  padding: 23px 40px 21px 20px;
}

.resumeCurriculumSampleList ul li a::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 15px;
  width: 8px;
  height: 14px;
  background-image: url(/cmn_web/img/guide/index/arrow_blue_right.png);
  background-repeat: no-repeat;
  background-size: 8px auto;
  background-position: center center;
  margin-top: -7px;
}

.resumeCurriculumSampleList ul li:not(:last-child) a::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 19px;
  width: 50px;
  height: 50px;
  background-repeat: no-repeat;
  background-size: 50px auto;
  background-position: center center;
  margin-top: -25px;
}

.resumeCurriculumSampleList ul li.resumeSample a::after {
  background-image: url(/cmn_web/img/guide/index/resume_sample_icon.png);
}

.resumeCurriculumSampleList ul li.curriculumSample a::after {
  background-image: url(/cmn_web/img/guide/index/curriculum_vitae_sample_icon.png);
}

/*--------------------------------------------------
  listAsideBnr
--------------------------------------------------*/
.listAsideBnr li:not(:last-child) {
  margin-bottom: 15px;
}

.listAsideBnr li img {
  width: 100%;
  height: auto;
  border: solid 1px #e5e5e5;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

/*--------------------------------------------------
  guideMangaVisualBnr
--------------------------------------------------*/
.guideMangaVisualBnr img {
  width: 100%;
  height: auto;
  border: solid 1px #e5e5e5;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

/*--------------------------------------------------
  guideChatVisualBnr
--------------------------------------------------*/
.guideChatVisualBnr img {
  width: 100%;
  height: auto;
  border: solid 1px #e5e5e5;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

/*--------------------------------------------------
  popularArticleRankings
--------------------------------------------------*/
.popularArticleRankings {
  background-color: #ffffff;
  border: 1px solid #e6e6e6;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
  overflow: hidden;
}

.popularArticleRankings .rankingsTitle {
  color: #222222;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  border-top: 4px solid #59aadd;
  padding: 16px 10px 15px;
}

.popularArticleRankings ul li {
  position: relative;
  width: 100%;
  height: 80px;
  background-color: #ffffff;
  margin: 0;
  overflow: hidden;
}

.popularArticleRankings ul li:last-child {
  margin-bottom: 8px;
}

.popularArticleRankings ul li .rankingNumber {
  position: absolute;
  top: 0;
  left: 10px;
  width: 16px;
  height: 28px;
  font-size: 16px;
  font-weight: bold;
  line-height: 1em;
  text-align: center;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  z-index: 1;
}

.popularArticleRankings ul li:nth-child(-n + 3) .rankingNumber {
  color: #222222;
  background-repeat: no-repeat;
  background-size: 16px auto;
  background-position: center center;
  padding-top: 5px;
}

.popularArticleRankings ul li:nth-child(n + 4) .rankingNumber {
  color: #aaaaaa;
  padding-top: 10px;
}

.popularArticleRankings ul li:nth-child(1) .rankingNumber {
  background-image: url(/cmn_web/img/guide/index/ranking_number_icon_01.png);
}

.popularArticleRankings ul li:nth-child(2) .rankingNumber {
  background-image: url(/cmn_web/img/guide/index/ranking_number_icon_02.png);
}

.popularArticleRankings ul li:nth-child(3) .rankingNumber {
  background-image: url(/cmn_web/img/guide/index/ranking_number_icon_03.png);
}

.popularArticleRankings ul li .imgArea {
  position: absolute;
  top: 10px;
  left: 38px;
  width: 60px;
  height: 60px;
  border: 1px solid #e6e6e6;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
}

.popularArticleRankings ul li .imgArea img {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: top;
}

.popularArticleRankings ul li .textArea {
  width: 100%;
  height: 100%;
  border-top: 1px solid #e6e6e6;
}

.popularArticleRankings ul li .textArea a {
  display: table;
  position: relative;
  width: 100%;
  height: 100%;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.5;
  text-align: left;
  background-color: rgba(255, 255, 255, 0);
  z-index: 2;
}

.popularArticleRankings ul li .textArea a span {
  display: table-cell;
  width: 100%;
  height: auto;
  vertical-align: middle;
  padding: 0 15px 0 112px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

.popularArticleRankings ul li .textArea a:hover span {
  text-decoration: underline;
}

/*202412 ABテスト用追記*/
.popularArticleRankings .nextMovie,
.popularArticleRankings .chapterListsTitle,
.popularArticleRankings .chapter {
  display: none;
}

/*--------------------------------------------------
  PC-guide_right_rectangle(既存ID使用)
--------------------------------------------------*/
#PC-guide_right_rectangle img {
  width: 100%;
  height: auto;
  border: solid 1px #e5e5e5;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

/*--------------------------------------
回遊用パーツ
----------------------------------------*/
.guideNavMenuWrap {
  border: 1px solid #e6e6e6;
  border-radius: 6px;
}

.nouhauWrap .guideNavTitle {
  background-color: #32bed2;
}

.guideNavTitle {
  background-color: #59aadd;
  color: #fff;
  font-weight: bold;
  font-size: 14px;
  text-align: center;
  padding: 14px;
  border-radius: 6px 6px 0px 0px;
}

.guideNavImg {
  width: 75px;
  margin-right: 15px;
}

.mainMenu {
  position: relative;
}

.mainMenuBtn {
  position: relative;
}

.mainMenuFirst .guideNavLinkIndex {
  color: #333;
  border-bottom: 1px solid #59aadd;
}

.nouhauWrap .guideNavLinkWrap:after {
  background-image: url(/cmn_web/img/guide/index/navicon_g.png);
}

.guideNavLinkWrap:after {
  background-image: url(/cmn_web/img/guide/index/navicon_b.png);
}

.guideNavLinkWrap:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 20px;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-size: 20px auto;
  background-position: center center;
  margin-top: -10px;
  z-index: 0;
}

.mainMenu:before {
  content: "";
  position: absolute;
  top: 50%;
  right: 24px;
  width: 12px;
  height: 2px;
  transform: rotate(90deg);
  background: #fff;
  transition: all 0.3s ease-in-out;
  z-index: 1;
}

.mainMenu:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 24px;
  width: 12px;
  height: 2px;
  background: #fff;
  transition: all 0.3s ease-in-out;
  z-index: 1;
}

.mainMenu.open:before {
  transform: rotate(180deg);
}

.guideNavLinkWrap,
.guideNavLinkIndex {
  display: flex;
  align-items: center;
  padding: 13px 10px;
  font-size: 14px;
  font-weight: bold;
  color: #333;
  background-color: #fafafa;
}

.guideNavMenuWrap .mainMenuBtn {
  margin-bottom: 0px;
  border-bottom: 1px solid #59aadd;
}

.guideNavMenuWrap .mainMenuBtn:last-of-type {
  border-bottom: none;
}

.guideNavMenuWrap:hover .mainMenuBtn:hover {
  cursor: pointer;
}

.memberRegistrationSubBtn:hover .memberRegistrationSubLink:hover {
  text-decoration: none;
  background-color: #fafafa;
  border-radius: 8px;
}

.guideNavMenuWrap .subMenu {
  display: none;
}

.subMenu .subMenuBtn {
  font-size: 14px;
  padding: 20px 15px 20px 10px;
  font-weight: bold;
  margin-bottom: 0px;
  border-bottom: 1px solid #e5e5e5;
}

.guideNavBtnText .stepText {
  color: #32bed2;
  display: block;
  margin-bottom: 6px;
}

.guideNavMenuWrap .subMenuBtn {
  position: relative;
}

.guideNavMenuWrap .subMenuBtn:hover {
  text-decoration: underline;
}

.guideNavMenuWrap .subMenuBtn:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 18px;
  width: 8px;
  height: 14px;
  background-image: url(/cmn_web/img/guide/index/arrow_blue_right.png);
  background-repeat: no-repeat;
  background-size: 8px auto;
  background-position: center center;
  margin-top: -7px;
}

/*--------------------------------------------------
  181202追加分
--------------------------------------------------*/
.successGuideMigration .guideMenu02 li.current01 {
  background: #f2f2f2 url(/guide/episodes/img/guide_navi_illust_02.png) 2% bottom no-repeat;
  background-size: 26%;
  border-top: none !important;
  border-left: none !important;
}

.successGuideMigration .guideMenu02 li.current02 {
  background: #f2f2f2 url(/guide/episodes/img/guide_navi_illust_03.png) left bottom no-repeat;
  background-size: 26%;
  border-top: none !important;
  border-left: none !important;
}

.successGuideMigration .guideMenu02 li.current03 {
  background: #f2f2f2 url(/guide/episodes/img/guide_navi_illust_04.png) 1% bottom no-repeat;
  background-size: 26%;
  border-top: none !important;
  border-left: none !important;
}

.successGuideMigration .guideMenu02 li.current01 a,
.successGuideMigration .guideMenu02 li.current02 a,
.successGuideMigration .guideMenu02 li.current03 a {
  color: #000000;
}

/*--------------------------------------------------
  190515追加分
--------------------------------------------------*/
.memberRegistrationBtnArea .guideForFirst.medium a {
  height: 50px;
  width: 228px;
  line-height: 50px;
}

/*190624追加_調査隊キャラクター画像差し替え*/
.guideEditingPostscript.illustration01::before {
  top: -51px;
  right: 30px;
  width: 96px;
  background-image: url(/cmn_web/img/guide/cyousatai_illustration190624_01.png);
  background-size: 96px auto;
}

.guideEditingPostscript.illustration02::before {
  top: -54px;
  right: 30px;
  width: 116px;
  background-image: url(/cmn_web/img/guide/cyousatai_illustration190624_02.png);
  background-size: 116px auto;
}

.guideEditingPostscript.illustration03::before {
  top: -55px;
  right: 30px;
  width: 88px;
  background-image: url(/cmn_web/img/guide/cyousatai_illustration190624_03.png);
  background-size: 88px auto;
}

.successGuideMigration .guideMenu02 li.current03 {
  background: #f2f2f2 url(/guide/episodes/img/guide_navi_illust190624_04.png) 1% bottom no-repeat;
  background-size: 26%;
}

.guideMenu02 li:nth-child(3) {
  background: url(/guide/episodes/img/guide_navi_illust190624_04.png) 1% bottom no-repeat;
  background-size: 26%;
}

/*カウンセリングWeb予約モーダル*/
#counselingReserveLinkModal.modalBackground {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  opacity: 1;
  position: fixed;
  top: 0;
  transform: translate(0%, 0%);
  transition: opacity 0.3s;
  transition-delay: 0.1s;
  z-index: 3000;
  font-family:
    Hiragino Kaku Gothic Std,
    HiraKakuProN-W3;
}

#counselingReserveLinkModal .counselingModal {
  width: calc(100% - 60px);
  max-width: 383px;
  min-height: 206px;
  background: #ffffff 0% 0% no-repeat padding-box;
  border-radius: 6px;
  opacity: 1;
  position: absolute;
  padding: 15px 30px;
  font-size: 14px;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: 241px;
  box-sizing: border-box;
}

#counselingReserveLinkModal .modalHeader {
  font-weight: bold;
  position: relative;
  margin-bottom: 15px;
  color: #333333;
  font-size: 16px;
  height: 22px;
  line-height: 1.5;
}

#counselingReserveLinkModal .close {
  display: inline-block;
  text-align: right;
  height: 15px;
  width: 15px;
  position: absolute;
  right: -13px;
  font-size: 25px;
  font-weight: normal;
  line-height: 0.6;
  color: #757575;
  opacity: 1;
  cursor: pointer;
}

#counselingReserveLinkModal .caImg {
  height: 89px;
  width: 110px;
  vertical-align: middle;
}

#counselingReserveLinkModal .message {
  display: inline-block;
  width: calc(100% - 142px);
  vertical-align: middle;
  margin-left: 32px;
  line-height: 1.5;
}

#counselingReserveLinkModal .reserveBtn {
  background: transparent linear-gradient(180deg, #7dba3c 0%, #60ab0f 100%) 0% 0% no-repeat
    padding-box;
  border-radius: 8px;
  color: #ffffff;
  text-align: center;
  margin-top: 20px;
  margin-bottom: 15px;
  padding: 16px 0;
  font-weight: bold;
  display: block;
  text-decoration: none;
  line-height: 1.5;
}

.slider li a .title {
  min-height: 38px !important;
}

.slider li a .job {
  min-height: 36px !important;
  display: block;
}

@media only screen and (max-device-width: 480px) {
  #counselingReserveLinkModal .close {
    right: 2px;
  }

  #counselingReserveLinkModal .reserveBtn {
    height: 50px;
  }

  #counselingReserveLinkModal .counselingModal {
    height: 236px;
    max-width: 345px;
    padding: 15px;
  }

  #counselingReserveLinkModal .message {
    width: calc(100% - 125px);
    margin-left: 15px;
  }
}

/*------公開日マークアップ------*/
.tp-intro-info {
  text-align: right;
  font-size: 14px;
}

/*---- 20201116追加バナーパーツ ----*/
.infoArea.boxStyle--test {
  padding: 16px 20px 16px;
  position: relative;
  margin: 30px auto;
  background: #eef4fc;
}

.media.full--inBox.test_box li .test_img {
  float: left;
  width: 229px;
  border: 1px solid #e6e6e6;
}

.media.full--inBox.test_box li .test_textbox {
  float: left;
  width: 590px;
  margin: 0 0 0 20px;
}

.media.full--inBox.test_box li .test_btn {
  margin-left: 0;
  width: 600px;
}

.media.full--inBox.test_box li .test_link {
  font-weight: bold;
  padding: 12px 0;
  width: 365px;
  font-size: 16px;
}

.media.full--inBox.test_box .test_btn {
  text-align: center;
}

.media.full--inBox.test_box .test_btn a {
  background: #fff;
  border: solid 1px #cccccc;
  border-radius: 6px;
  box-shadow: 0 1px 0 #cccccc;
  font-weight: normal;
  color: #3d3d3d;
}

/*------guide固有縦長リンク付CVボタン------*/
.btnBox01.type01.inLink {
  height: 138px;
}

.btnBox01.type01.inLink dt {
  height: 136px;
  padding-top: 39px;
  font-size: 20px;
}

.btnBox01 .linkText {
  font-size: 12px;
  text-align: center;
  margin-top: 18px;
  padding-right: 30px;
  position: relative;
  display: inline-block;
}

.btnBox01 .linkUrl {
  display: block;
}

.btnBox01 .linkText::after {
  content: "";
  width: 5px;
  height: 5px;
  border: 0px;
  border-top: solid 2px #007fc3;
  border-right: solid 2px #007fc3;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 58%;
  margin-top: -5px;
  margin-left: 5px;
}

/*------手前アロー付きリンク------*/
.link_arrow_before {
  display: inline-block;
  position: relative;
  padding-left: 20px !important;
}

.articleBox .paragraph {
  margin-bottom: 20px;
}

.link_arrow_before::before {
  content: "";
  position: absolute;
  top: 0.5em;
  left: 0;
  width: 7px;
  height: 7px;
  border-top: 2px solid #007fc3;
  border-right: 2px solid #007fc3;
  transform: rotate(45deg);
}

/*------20211101共有CVボタン------*/
.btnBox_conv {
  display: flex;
  border-radius: 6px;
  border: 1px solid #cccccc;
  position: relative;
  margin-top: 30px;
  margin-bottom: 20px;
}

.btnBox_conv + .btnBox_conv {
  margin-top: 20px;
}

.btnBox_conv .textArea {
  width: 50%;
  box-sizing: border-box;
  background-color: #f2f2f2;
  padding: 25px;
  font-size: 20px;
  font-weight: bold;
  border-radius: 6px 0 0 6px;
}

.btnBox_conv .textArea .text_conv {
  display: block;
}

.btnBox_conv .textArea .text_conv:only-child {
  padding: 13px 0 13px;
}

.btnBox_conv .textArea .subText_conv {
  font-size: 16px;
  font-weight: normal;
  display: block;
  color: #aaa;
  margin-top: 5px;
}

.btnBox_conv .textArea .subText_conv .subLink_conv:link {
  font-weight: bold;
  display: inline-block;
  color: #007fc3;
}

.btnBox_conv.orangeLine:before {
  background-color: #ff5a00;
  border-radius: 6px 0px 0px 6px;
  content: "";
  display: block;
  height: 100%;
  width: 6px;
  top: 0;
  left: -1px;
  position: absolute;
}

.btnBox_conv.greenLine:before {
  background-color: #88c04b;
  border-radius: 6px 0px 0px 6px;
  content: "";
  display: block;
  height: 100%;
  width: 6px;
  top: 0;
  left: -1px;
  position: absolute;
}

.btnBox_conv.blueLine:before {
  background-color: #007fc3;
  border-radius: 6px 0px 0px 6px;
  content: "";
  display: block;
  height: 100%;
  width: 6px;
  top: 0;
  left: -1px;
  position: absolute;
}

.btnBox_conv .btnArea {
  width: 50%;
  box-sizing: border-box;
  text-align: center;
  padding: 10px;
  position: relative;
}

.btnOrange_conv {
  color: #ffffff;
  background: linear-gradient(#fd8331, #f60);
  font-weight: bold;
  text-decoration: none;
  border-radius: 8px;
  display: block;
  text-align: center;
  width: 400px;
  box-sizing: border-box;
  padding: 14px;
  font-size: 18px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
}

.btnOrange_conv:link,
.btnOrange_conv:visited,
.btnOrange_conv:active {
  color: #ffffff;
  text-decoration: none;
}

.btnOrange_conv:hover {
  background: #ff8340;
  color: #ffffff;
  text-decoration: none;
}

.btnGreen_conv {
  color: #ffffff;
  background: linear-gradient(#7dba3c, #60ab0f);
  font-weight: bold;
  text-decoration: none;
  border-radius: 8px;
  display: block;
  text-align: center;
  width: 400px;
  box-sizing: border-box;
  padding: 14px;
  font-size: 18px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
}

.btnGreen_conv:link,
.btnGreen_conv:visited,
.btnGreen_conv:active {
  color: #ffffff;
  text-decoration: none;
}

.btnGreen_conv:hover {
  background: #88c04b;
  color: #ffffff;
  text-decoration: none;
}

.btnBlue_conv {
  color: #ffffff;
  background: linear-gradient(#3197cd, #017fc3);
  font-weight: bold;
  text-decoration: none;
  border-radius: 8px;
  display: block;
  text-align: center;
  width: 400px;
  box-sizing: border-box;
  padding: 14px;
  font-size: 18px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
}

.btnBlue_conv:link,
.btnBlue_conv:visited,
.btnBlue_conv:active {
  color: #ffffff;
  text-decoration: none;
}

.btnBlue_conv:hover {
  background: #409fd2;
  color: #ffffff;
  text-decoration: none;
}

.btnBox_conv .btnArea .btnSub_conv {
  font-size: 14px;
}

/*------診断コンテンツ一覧------*/
.diagnoseList .diagnoseImg {
  margin-left: -20px;
}

.popularArticleRankings ul .diagnoseList .textArea a .diagnoseText {
  padding: 0 15px 0 95px;
}

/*--------------------------------------------------
ホールディングスのリンク群
--------------------------------------------------*/
.persolLink {
  display: grid;
  grid-auto-flow: row;
  row-gap: 14px;
  font-size: 1.2rem;
  line-height: 1.5;
  color: #222;
  padding: 24px 0;
  border-top: 1px solid #e6f1f5;
  border-bottom: 1px solid #e6f1f5;
  font-weight: 500;
}

.persolLink__category {
  display: grid;
  grid-template-columns: 110px 1fr max-content;
  align-items: center;
}

.persolLink__heading,
.persolLink__subHeading {
  font-weight: 700;
}

.persolLink__middle {
  display: grid;
  grid-auto-flow: row;
  row-gap: 8px;
  padding-left: 24px;
  min-height: 32px;
  border-left: 1px solid #ccc;
}

.persolLink__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px 12px;
}

.persolLink__item {
  padding-right: 12px;
}

.persolLink__item:first-of-type {
  padding-left: 0;
}

.persolLink__item:not(:last-of-type) {
  border-right: 1px solid #ccc;
}

#footer .persolLink__link,
#footer .persolLink__button {
  color: inherit;
  white-space: nowrap;
}

.persolLink__subCategory {
  display: grid;
  grid-template-columns: 140px 1fr;
  padding: 0;
  border: 0;
  column-gap: 10px;
  align-items: center;
}

.persolLink__button {
  width: 150px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 1.2rem;
  line-height: 1;
  font-weight: 700;
  background-color: #ffffff;
  border: 1px solid #e5e5e5;
  border-radius: 4px;
}

.persolLink__button:hover {
  text-decoration: none;
}

.footThird--abovePersolLink {
  font-size: 1.1rem;
  line-height: 2;
  padding: 16px 0 8px;
}

.footThird--abovePersolLink .footUtility {
  line-height: inherit;
}

.footThird--abovePersolLink .icoBlank02:after {
  top: 2px;
}


