@charset "utf-8";

/* ----- 共通設定 ----- */
.knowhow-wrap {
	font-size: 14px;
	padding: 10px 0;
	margin-top: 10px;
	margin-bottom: 50px;
}
.knowhow-wrap a {
	color: #0077E6;
}
.cont-knowhow {
	padding-bottom: 10px;
}
.ttl-related {
	background-color: #ffeeb7;
	border-left: 3px solid #fcbe00;
	font-weight: bold;
	padding: 8px 12px 7px;
}

/* リセット */
.cf:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.cf {
	display: inline-table;
}
/* Hides from IE-mac \*/
* html .cf {height: 1%; }
.cf { display: block; }
/* End hide from IE-mac */

/* 大見出し */
.ttl-wrap {
	background-color: #ffffcc;
	border: #ff6600 1px solid;
	margin-bottom: 20px;
	padding: 15px;
}
.icn-wrap {
	float: left;
	height: 81px;
	padding-right: 15px;
	width: 82px;
}
.ttl-inr-wrap {
	float: right;
	width: 630px;
}
.ttl-main {
	color: #ff6600;
	font-size: 20px;
	font-weight: bold;
	padding-bottom: 10px;
}
.txt-intr {
	font-size: 12px;
}
/* アーカイブ */
.lst-archive{
	overflow: hidden;
	padding: 0px 10px 10px 0px;
	*zoom: 1;
}
.lst-archive li{
	padding: 0 0 10px 10px;
	*zoom: 1;
}
.lst-topicks li {
	box-sizing: border-box;
	-ms-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	float: left;
	margin: 0 0 10px 20px;
	width: 350px;
}
/* コンテンツ */
.about-wrap {
	padding-bottom: 20px;
}
.ttl-about-wrap {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 20px;
	position: relative;
}
.ttl-about-inr {
	padding: 5px 0px 0px 11px;
	border-left: solid 10px #FCBE00;
	font-size: 24px;
}
.ttl-about-inr:before {
	content: " ";
	height: 44px;
	left: 5px;
	margin-top: -22px;
	position: absolute;
	top: 50%;
	width: 50px;
}
.dtl-wrap {
	padding: 0 10px 20px;
}
.dtl-wrap dd {
}
.ttl-dtl {
	font-weight: bold;
	font-size:20px;
	padding-bottom:10px;
	margin-left: -10px;
}
.ttl-dtl-l {
	background-image: url(/twc/magazine/pc/know-how/img/icn-square.png);
	background-repeat: no-repeat;
	background-position: 0 4px;
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 10px;
	padding-left: 18px;
}
.txt-dtl {
	padding: 0 10px 15px;
}
.lst-dtl {
	margin-top: 10px;
	padding: 20px;
	width: 360px;
}
.point-wrap {
	box-sizing: border-box;
	-mz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	margin: 0 0 10px 10px;
	padding: 20px 25px;
	width: 750px;
}
.ttl-point {
	background-image: url(/twc/magazine/pc/know-how/img/icn-alert.png);
	background-repeat: no-repeat;
	background-position: 0 2px;
	color: #ff6600;
	font-weight: bold;
	padding-left: 20px;
}
.point-wrap-inr {
	display: table;
	padding: 15px 10px 0;
}
.point-wrap-inr p {
	display: table-cell;
}
.lst-ex {
	display: table-cell;
}
.lst-item,
.lst-que {
	margin-top: 10px;
	padding: 20px 25px;
}
.lst-item li,
.lst-que li {

}
.lst-rule {
	padding: 25px 20px;
	background-color: #F9F6E9;
}
.lst-rule .clr-or {
	padding-right: 5px;
}
.img-tbl {
	padding: 20px 0 10px;
}
.ttl-case {
	background-image: url(/twc/magazine/pc/know-how/img/icn-dia.png);
	background-repeat: no-repeat;
	background-position: 0 3px;
	font-weight: bold;
	padding-left: 18px;
}

/* バナー */
.lst-confirm {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	padding: 0 10px;
	width: 760px;
}
.lst-confirm li {
	float: left;
	font-size: 16px;
	font-weight: bold;
	margin-right: 5px;
}
.lst-confirm li a {
	background-image: url(/twc/magazine/pc/know-how/img/bg-bnr.png);
	background-repeat: no-repeat;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	color: #990000;
	display: block;
	height: 90px;
	padding: 22px 30px 20px 15px;
	width: 240px;
}
.lst-confirm li a:hover {
	filter: alpha(opacity=80);
	opacity: 0.8;
	-moz-opacity: 0.8;
	text-decoration: none;
}

/* トークマニュアル */
.talk-manual-wrap {
	padding: 0 15px;
	margin-top: -20px !important;
	margin-bottom:20px;
}
.talk-wrap-inr {
	display: table;
	padding: 5px 0;
}
.txt-talk {
	display: table-cell;
	vertical-align: middle;
}
.icn-person {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	display: table-cell;
	padding-right: 10px;
	vertical-align: middle;
}

/* 面接の服装 */
.fashion-wrap {
	padding: 10px;
}
.fashion-wrap-inr-l {
	float: left;
	width: 333px;
}
.fashion-wrap-inr-r {
	float: right;
	width: 364px;
}
.img-fashion {
	padding-bottom: 20px;
}
.lst-ng-fashion {
	border: #ff6600 1px solid;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	font-size: 12px;
	padding: 10px;
	min-height: 98px;
}
.lst-ng-fashion dd {
	float: left;
	padding-right: 10px;
}

/* Q&A */
.que-box {
	background-color: #fffee9;
	border: #ff6600 2px dotted;
	padding: 15px 20px;
}
.ttl-que-wrap {
	font-weight: bold;
	padding: 0 0 10px 30px;
	position: relative;
}
.ttl-que-inr:before {
	content: " ";
	height: 29px;
	left: 0;
	margin-top: -3px;
	position: absolute;
	top: 0;
	width: 28px;
}
.icn-info:before {
	background-image: url(/twc/magazine/pc/know-how/img/icn-info.png);
	background-repeat: no-repeat;
}

/* 税金の計算例 */
.tax-dtl{
	padding-bottom: 20px;
}
.txt-tax-ex {
	padding: 0 1em;
}
.txt-tax-ex p:nth-child(n+2) {
	padding-left: 1em;
}

/* 背景・文字装飾 */
.clr-or {
	color: #000000;
}
.red {
	color: red;
}
.fwb {
	font-weight: bold;
	font-size:15px;
}
.bg-pattern {
	background-color: #F9F6E9;
}
.bg-stripe {
	background-image: url(/twc/magazine/pc/know-how/img/bg-stripe.png);
}
.pb10 {
	padding-bottom: 10px;
}
.bdb-or {
	border-bottom: #ff6600 1px solid;
}
.mt10 {
	margin-top: 10px;
}
.pl2em {
	padding-left: 2em;
}
/* リンク */
.lnk-other-topicks {
	text-align: right;
}
.lnk-other-topicks-inr {
	padding-left: 10px;
	position: relative;
}
.lnk-other-topicks-inr a:before {
	content: " ";
	height: 7px;
	left: 0;
	margin-top: -4px;
	position: absolute;
	top: 50%;
	width: 5px;
}
.icn-arr-r-yl:before {
	background-image: url(/twc/magazine/pc/know-how/img/icn-arr-r-yl.png);
	background-repeat: no-repeat;
}

/* add style */
.fl	{
	float: left;
}
.mt10 {
	margin-top: 10px;
}
.mt20 {
	margin-top: 20px;
}
.pl30 {
	padding-left: 30px;
}
.cont-nav-lst {
	border-top: #ff6600 1px solid;
	border-left: #ff6600 1px solid;
	border-bottom: #ff6600 1px solid;
	width: 100%;
	display: table;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.cont-nav-lst li {
	border-right: #ff6600 1px solid;
	display: table-cell;
	text-align: center;
}
.cont-nav-lst li a {
	display: table;
	width: 100%;
	padding: 5px;
	color: #333333;
	font-weight: bold;
	text-decoration: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.cont-nav-lst li.nav-current {
	display: table;
	width: 100%;
	padding: 5px;
	background-color: #ff6600;
	color: #ffffff;
	font-weight: bold;
	text-decoration: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.list-wrap {
	margin-top: 10px;
	padding: 20px 25px;
}
.ng-wrap {
	width: 345px;
}
.lst-archive-txt {
	margin-top: -20px;
	padding-left: 10px;
}
.nav-btn-wrap {
	margin-bottom: 20px;
}
.nav-btn-wrap p {
	padding-bottom: 0!important;
}
.nav-btn-wrap.single {
	margin-top: 20px!important;
}
.nav-btn-lst {
	margin-left: 0!important;
}
.nav-btn-lst li {
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
}
.nav-btn-lst li:last-child {
	margin-right: 0!important;
}
.nav-btn-lst li a {
	display: table-cell;
	padding-top: 5px;
	padding-bottom: 5px;
	vertical-align: middle;
	text-decoration: underline;
	font-weight:bold;
	font-size:16px;
}
.nav-btn-lst.col2 li a {
	width: 370px;
	height: 47px;
}
.nav-btn-lst.col3 li a {
	width: 244px;
}

.resume-txt-wrap {
	width: 380px
}
.ttl-low-h3:before {
	background-image: url(/twc/magazine/pc/know-how/img/icn-square.png);
	background-repeat: no-repeat;
	background-position: 11px 17px;
}

/* 吹き出し */
.balloon{
  position: relative;
  padding: 20px;
  background-color: #ffffff;
  border: 1px solid #ca8888;
  border-radius: 10px;
  width:620px;
}

.balloon::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: -15px;
  top: 25px;
  border-right: 15px solid #ca8888;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}
.balloon::after{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: -14px;
  top: 25px;
  border-right: 15px solid #ffffff;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}

.balloon2{
  position: relative;
  padding: 20px;
  background-color: #ffffff;
  border: 1px solid #ca8888;
  border-radius: 10px;
  width:620px;
}

.balloon2::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: -15px;
  top: 35px;
  border-right: 15px solid #ca8888;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}
.balloon2::after{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: -14px;
  top: 35px;
  border-right: 15px solid #ffffff;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}

.balloon3{
  position: relative;
  padding: 20px;
  background-color: #ffffff;
  border: 1px solid #ca8888;
  border-radius: 10px;
  width:620px;
}

.balloon3::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: -15px;
  top: 15px;
  border-right: 15px solid #ca8888;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}
.balloon3::after{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: -14px;
  top: 15px;
  border-right: 15px solid #ffffff;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}

.box_index {
    padding: 0.5em 1em;
    margin: 2em 0;
    margin-top:-20px;
    background: #FFF;
    border: solid 1px #a6a6a6;
    border-radius: 4px;
}
.box_index p {
    margin-left: 0px;
    margin-bottom: 10px;
    margin-top: 10px;
    font-weight: bold;
    font-size: 16px;
    color: #000000;
}









