@charset "utf-8";

/* ============================================
                   CSS RESET
============================================ */

html{color:#000;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}
address,article,aside,figure,figcaption,footer,header,hgroup,hr,legend,menu,nav,section,summary { display: block;margin: 0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}
del,ins{text-decoration:none;}li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:baseline;}
sub{vertical-align:baseline;}
legend{color:#000;}
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}
input,button,textarea,select{*font-size:100%;}


/* ============================================
             CSS SET UP - D131
============================================ */

.content_box p { line-height: 1.7;}
/*h1,h2,h3,h4,dl,ul { line-height: 1.3;}*/
.content_box p { margin-bottom: 16px;}
#sidebar p { margin-bottom: 14px;}
/*.content_box ul { margin-bottom: 14px;}*/
.content_box li { margin-bottom: 4px;}
.content_box img { vertical-align: middle;}
.content_box a { color: #2B60D9;outline:none;}
.content_box a:hover { color: #5285FA;text-decoration: none;opacity: .75;}
.content_box sup { vertical-align: top;}

/* clearfix */
.pkg:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.pkg{overflow:hidden;}
/* Hides from IE-mac \*/* html .pkg{ height:1%;overflow:visible;}/* End hide from IE-mac */

/*  font style */
.small { font-size: 86%;}
.srg { font-weight: normal;}
.red { color: #ff0000;}
.textL { text-align: left;}
.textR { text-align: right;}
.textC{ text-align: center;margin-bottom: 20px;}

/* image button */
.img-btn img{ transition: 0.3s;}
.img-btn:hover img { opacity: 0.8;}

/* dl,dt,dd */
.definition { margin-bottom: 20px;}

.definition dl {
	border-top: 1px solid #ddd;
	padding: 6px 0 2px 0;
	margin: 0 0 3px;
}

.definition dl:last-child {border-bottom: 1px solid #ddd;}
.definition dt {width: 100px;float: left;margin: 0 20px 0 0px;}
.definition dd {width: 570px;float: left;}

/* table */
table { width: 100%; margin-bottom: 30px;}
th,td { border: 1px solid #ccc;padding: 8px 10px 6px;}
th { background: #f1f1f1;text-align: center;}

/* list */
.content_box .list li {
	margin: 0 0 14px 16px;
	list-style: disc outside;
}

/* margin */
.content_box .margin0, #sidebar .margin0 { margin-bottom: 0px;}
.content_box .margin4, #sidebar .margin4 { margin-bottom: 4px;}
.content_box .margin6, #sidebar .margin6 { margin-bottom: 6px;}
.content_box .margin8, #sidebar .margin8 { margin-bottom: 8px;}
.content_box .margin10, #sidebar .margin10 { margin-bottom: 10px;}
.content_box .margin20, #sidebar .margin20 { margin-bottom: 20px;}
.content_box .margin30, #sidebar .margin30 { margin-bottom: 30px;}
.content_box .margin40, #sidebar .margin40 { margin-bottom: 40px;}
.content_box .margin60, #sidebar .margin60 { margin-bottom: 60px;}
.content_box .margin100, #sidebar .margin100 { margin-bottom: 100px;}

/* float */
.left {float: left;}
.right { float: right;}

/* ============================================
             フォントのサイズ調整
============================================ */

.content_box {
    font-size: 13px; /* モダンブラウザ向け */
    *font-size: small; /* IE 7向け */
    *font: x-small; /* IE 6以下 */
	font-family:"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","Osaka","メイリオ","Meiryo","ＭＳ Ｐゴシック","verdana",sans-serif;
}

/*  menu ------------------------------------- */

#menu li {	float: left;margin:0 10px 0 0;}
#menu li:first-child { background: none;padding-left:15px;}
#menu a:focus{ /*\*/ overflow: hidden;outline: none; /**/ }

#menu li a{ display: block;}
#menu li li a { transition: none;}

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

/*  menu - dropdown  --------------------------------- */

.dropdown {
	position:absolute;
	width: auto;
	font-size: 86%;
	padding: 10px 6px 2px 6px;
	border: 1px solid #DFE8F1;
	border-radius: 5px;
	box-shadow: 2px 2px 2px #aaa;
	-webkit-box-shadow: 2px 2px 2px #aaa;
	-moz-box-shadow: 2px 2px 2px #aaa;
	background: url(/images/front/agent/dental-hygienist/dropdown.png) repeat-x #e1e8ef;
}

#menu .dropdown li { float: none;height: auto;background: none;width: auto;margin: 0 0 2px 0;padding:0;}
#menu .dropdown li a { color:#006699;text-decoration:none;background: url(/images/front/agent/dental-hygienist/arrow.png) no-repeat 3px center;padding: 4px 6px 4px 24px;display:block;}
#menu .dropdown li a:hover { background:url(/images/front/agent/dental-hygienist/arrow.png) no-repeat 3px center #D6E2ED;border-radius:8px;}
#menu .dropdown li a:hover { background-color: rgba(0,127,219,0.1);}
* html #menu .dropdown li a { width: 240px;}


/*  sub menu ----------------------------------------- */

#smenu li { float: left;margin: 0 20px 0 0;}
#smenu:after{content:".";display:block;height:0;clear:both;visibility:hidden;}


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

/* scroll bar */
html{overflow-y:scroll;}

/* footer fixed bottom */
html{ height:100%;}
body{ height:100%;}




/* frame layout  ----------------------------------  */

body { 
	background: url(/images/front/agent/dental-hygienist/body_bg.png) repeat-x;
}

#container {
	width: 980px;
	margin: 0 auto;
}

#header {
	height: 52px;
	position: relative;
}

#mainvisual {margin-bottom: 20px;height: 348px;}



/* header  ------------------------------------------  */

#header-bg { display:none;}

#header #logo {
	position: absolute;
	left: 0px;
	top: 13px;
}

#menu {
	position: absolute;
	left: 282px;
	top: 10px;
	width: 570px;
}

#smenu {
	position: absolute;
	right: 300px;
	top: 40px;
}

#header-medipass {
	position: absolute;
	right: 0;
	top: 14px;
}



/* mainvisual  --------------------------------------  */

#mainvisual {
	position: relative;
}

#mainvisual-title {
	position: absolute;
	left: 28px;
	top: 50px;
}

#mainvisual-btn {
	position: absolute;
	left: 28px;
	top: 182px;
}





/* main --------------------------- */
.arrow-link {
	background: url(/images/front/agent/dental-hygienist/arrow.png) no-repeat left center;
	padding: 0 0 0 18px;
	display: inline-block;
}

.title { 
	position: relative;
	border-radius: 6px;
	overflow: hidden;
	margin: 0 0 18px;
}

.title-text {
	position: absolute;
	left: 10px;
	top: 8px;
}

.content-box { margin-bottom: 40px;}


/* reason */
#reason { }

#reason-arrow {
	text-align: center;
	margin: 0 0 10px;
}
.reason-arrow-inner {
	padding: 20px;
}

#reason section {
	width: 480px;
	padding: 1px;
	border: 1px solid #ccc;
	border-radius: 6px;
	min-height: 520px;
}

#reason section .inner {
	padding: 12px 15px 20px;
}

/* area */
#area {
	width: 855px;
	margin-right: auto;
	margin-left: auto;
}

#area .left {padding-top: 18px;}
#area .left h1 { margin: 0 0 16px;}

/* entry-box */
.entry-box {
	width: 780px;
	position: relative;
	margin-right: auto;
	margin-left: auto;
}

.entry-box h1 {
	position: absolute;
	left: 30px;
	top: 30px;
}

.entry-box h1 img {
	display: block;
	margin: 0 0 16px 0;
}

.entry-box .entry-btn {
	position: absolute;
	right: 30px;
	top: 20px;
}

.entry-box .entry-link {
	width: 345px;
	position: absolute;
	right: 30px;
	bottom: 8px;
	text-align: center;
}

.content_box .entry-box .entry-link ul { margin: 0;}

.entry-box .entry-link li {
	display: inline;
	margin: 0 10px 0;
}

.entry-box .entry-link a {}

.entry-box .entry-link a:hover {
	text-decoration: underline;
}

/* voice */

#voice section { margin: 0 0 30px;}

#voice .comment h1 { margin-bottom: 8px;}

#voice .comment { 
	width: 890px;
	height: 170px;
	padding: 12px 20px 0;
}


#voice .comment-right { float: right;background: url(/images/front/agent/dental-hygienist/voice-comment-bg1.png) no-repeat;padding-left: 30px;}
#voice .comment-left { float: left;background: url(/images/front/agent/dental-hygienist/voice-comment-bg2.png) no-repeat;padding-right: 30px;}
#voice .img-left { float: left;}
#voice .img-right { float: right;}

/* appeal */
#appeal {
	background: #FFF2F2;
	border-radius: 8px;
}

#appeal .title {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	margin: 0 0 12px;
}

#appeal section {
	width: 470px;
	padding: 12px;
	background: #fff;
	border-radius: 8px;
	min-height: 156px;
}

#appeal .line1 { height: 200px;}
#appeal .line2 { height: 200px;}

.content_box #appeal section p { margin: 0 0 6px;}

#appeal section.left {margin: 0 0 14px 12px;}
#appeal section.right { margin: 0 12px 14px 0;}

#appeal section h1 { margin: 0 0 10px;}
#appeal section .left { width: 60px;}
#appeal section .right { width: 380px;}

#flow-wrap {
	background: url(/images/front/agent/dental-hygienist/flow-bg.png) no-repeat;
}

#flow-wrap section {
	width: 188px;
	padding: 0px;
	height: 250px;
	float: left;
	margin-left: 9px;
}

#flow-wrap section p {
	padding: 8px 10px;
}

#flow-wrap section:first-child { margin-left: 0;}

/* medipass */
#medipass .left { width: 301px;}

#medipass .right { 
	width: 664px;
	padding: 10px 0;
}

/* add pulldown menu by minoshima 20150227*/

.inner-menu {
	width: 100px;
	
}

.inner-menu:hover {
	z-index: 10;
}

.inner-menu-not-focus{ }
.inner-menu-focus{ display: none; }

.inner-menu:hover > .inner-menu-not-focus{ display: none; }
.inner-menu:hover > .inner-menu-focus{ display: block; }

.inner-menu-list { display: none; }

.inner-menu-list a {
	outline: none;
	text-decoration :none;
	cursor : auto;
	color : #cc0000;
	
}


.inner-menu:hover > .inner-menu-list {
	display: block;
	background-color : #efefef;
	opacity: 0.8;
	z-index:10;	
}

.inner-menu-text{
	z-index : 11;
	
}

.inner-menu-text:hover{
	z-index : 11;
	text-decoration : underline;
}


.sphone { display: none;}
#sphone-menu-open,#sphone-menu ul,#footer-menu-sphone,#bottom-menu-sphone{ display: none;}

/* pc ------------------ */

@media screen and ( min-width: 768px){
	#sphone-menu ul { position: absolute;top: -9999px;}
}


@media screen and (max-width: 767px) {

	a{-webkit-tap-highlight-color: rgba(0,0,0,0)}

	img{
		max-width: 100%;
		height: auto;
		width /***/:auto;　
	}

	.pc { display: none;}
	.sphone-inline { display: inline;}
	.sphone { display: block;}

	.content_box .left,
	.content_box .right,
		#appeal section { float: none;width:auto;}
	/*
	.content_box br { display: none;}
	.content_box br.sp { display: inline;}
	*/


	/* frame */
	body { background: none;}

	#container{
		width:100%;
		padding-bottom: 20px;
	}

	#header { height: auto;background: #FAA2A2;}
	#content { padding: 0 10px;}
	#main,#sidebar { 
		width: 100%;
		float: none;
		margin: 0 0 20px;
	}



	#header #logo,#header-medipass {
		position: relative;
		left: auto;
		right: auto;
		bottom: auto;
		top: auto;
		margin: 0 0 2px;
		text-align: center;
		padding: 8px 0 0 10px;
	}

	#header #logo { padding: 0 0 0 10px;}

	#header #summary p,#header #menu,#header #smenu,#header #tel {
		display: none;
	}

	#header #summary h1 {
		font-size: 85%;
	}

	#sphone-menu-open {
		text-align: center;
		display: block;
		margin: 10px 0;
	}

	#sphone-menu-open img{
		width: 130px;
	}

	#sphone-menu-open a{-webkit-tap-highlight-color: rgba(0,0,0,0)}

	#sphone-menu {
		border-top: 1px solid #fff;
		border-bottom: 1px solid #fff;
		min-height: 0px;
		background: #FAA2A2;
	}

	#sphone-menu ul { 
		position: relative;
		top: 0;
		background: #FAA2A2;
		border-top: 1px solid #999;
		border-bottom: 1px solid #fff;
		padding: 6px 0;
	}

	#sphone-menu ul ul {
		border-top: none;
		border-bottom: none;
		padding: 0 0 0px 16px;
	}

	#sphone-menu ul li {}

	#sphone-menu ul a {
		border-radius: 4px;
		display: block;
		background: url(/images/front/agent/dental-hygienist/arrow.png) no-repeat 7px center #ffecec;
		color: #fff;
		padding: 6px 8px 6px 26px;
		margin: 0 10px 4px 10px;
		text-decoration: none;
		border-right:1px  solid #FFCCCC;
		border-bottom: 1px solid #FFCCCC;
	}

	/* mainvisual */


	#mainvisual {
		background: #FFC182;
		height: auto;
	}

	#mainvisual-bg {
		padding: 0px 0 0;
		overflow: hidden;
	}

	#mainvisual-title {
		left: 0px;
		top: 32%;
		width: 100%;
	}

	#mainvisual-title img {
		/*width: 200px;*/
		width:60%;
		margin-left: 10px;
	}

	#mainvisual-bg img {
		max-width: 115%;
	}

	/* common class */

	.title { 
		position: relative;
		border-radius: 6px;
		overflow: hidden;
		margin: 0 0 18px;
		background: url(/images/front/agent/dental-hygienist/title-bg.png);
		padding: 6px;
	}

	.title-text {
		position: relative;
		left: auto;
		top: auto;
		width: 350px;
	}

	.title-bg {
		display: none;
	}

	/* sphone entry */
	#sphone-entry-box {
		width: 260px;
		margin: 0 auto 30px;
	}

	/* reason */
	#reason section {
		margin:0 auto 0px;
		width: auto;
		max-width: 476px;
		min-height: inherit;
	}

	#reason section:last-child { margin-top: 10px;}


	/* area */

	#area {
		width: 310px;
		margin: 0 auto 30px;
	}

	#area .left { padding-top: 0;}

	/* entry-box */
	.entry-box {
		background: #FFDCDC;
		border-radius: 8px;
		height: auto;
		width: 80%;
		padding: 10px 20px;
		text-align: center;
		margin-bottom: 80px;
	}

	.entry-box h1,
	.entry-box .entry-btn,
	.entry-box .entry-link {
		position: relative;
		left: auto;
		top: auto;
		right: auto;
		bottom:auto;
		width: auto;
	}

	.entry-box .entry-btn {
		margin: 0 0 4px;
	}

	.entry-box .entry-link li {
		display: block;
		width: 200px;
		text-align: left;
		margin: 0 0 4px 28px;
	}

	.entry-box h1 {
		width: 210px;
		margin-left: auto;
		margin-right: auto;
	}

	.entry-box h1 img {margin: 0 0 10px;}


	.entry-box #entry-bg {
		display: none;
	}

	/* voice */
	#voice .comment {
		background: #E8F1F5;
		border-radius: 8px;
		padding: 10px;
		width: 75%;
		height: auto;
	}

	#voice .img { width: 56px;}

	#voice .left { float: left;}
	#voice .right { float: right;}

	/* appeal */

	#appeal section.left,
	#appeal section.right {
		margin-right: 14px;
		margin-left: 14px;
		height: auto;
	}

	#appeal section .left {
		width: 40px;
		float: left;
		margin: 0 10px 10px 0;
	}

	#appeal section .right {
		width: auto;
	}

	/* flow */
	#flow-wrap {
		background: none;
	}

	#flow-wrap section:first-child {margin: 0 auto 10px;}

	#flow-wrap section {
		background: #EFF5F8;
		margin: 0 auto 10px;
		float: none;
		border-radius: 4px;
		height: auto;
	}

	#flow-wrap section:last-child {
		background: #FCF4F4;
	}

	/* medipass */
	#medipass .left {
		text-align: center;
	}



	/* footer */


	#footer-medipass {
		position: relative;
		top: auto;
		left: auto;
		text-align: center;
		margin: 0 0 10px;
	}

	.footer-menu { display: none;}


	/* mail form */

	#mailform dl { margin-bottom: 0;}

	#mailform dl dt,
	#mailform dl dd {
		width: auto;
		float: none;
	}

	#mailform dl dt { padding: 6px 10px;}

	body.confirm #mailform dl dd {
		padding: 6px 10px;
	}

	#mailform dl span.line { 
		display: inline-block;
		padding: 10px 0 0 0;
	}

	#mailform textarea { width: 95%;}

	#submitBox { width: auto;}

	#submitBox div {
		float: none;
		margin: 0 auto 10px;
		width: auto;
	}


	#mailform .sendBtn {
		display: block;
		margin: 0 auto 10px;
	}

	.content_box {
		margin: 0 20px;
	}
	#medipass .left ,
	#medipass .right {
		width: auto;
	}

}


.topimg_pc {
	height: 350px;
	margin-bottom: 40px;
	position: relative;
	background: url(/images/front/agent/dental-hygienist/top_pc.png) no-repeat;
}
.topimg_sp {
	display: none;
}
.topimg_ttl {
	position: absolute;
	left: 60px;
	top: 60px;
}
.topimg_btn {
	position: absolute;
	left: 66px;
	top: 185px;
}
#entry-bg {
	/*margin-bottom: 40px;*/
}
.agent_footer {
	font-size: 14px;
}
.agent_footer_top a ,
.agent_footer_top a:hover {
	color: #fff;
}
.agent_footer_btm a ,
.agent_footer_btm a:hover {
	color: #f23030;
}
.agent_footer_top {
  background: -moz-linear-gradient(top, #f05d5d 0%,#fdbbbb 100%);
  background: -webkit-linear-gradient(top, #f05d5d 0%,#fdbbbb 100%);
  background: linear-gradient(to bottom, #f05d5d 0%,#fdbbbb 100%);
	border-radius: 6px 6px 0 0;
	padding: 20px;
	position: relative;
}
.agent_footer_ul {
	position: absolute;
	display: inline-block;
	left: 330px;
	top: 22px;
}
.agent_footer_ul li {
	margin: 0 25px 14px 0;
	display: inline-block;
}
.agent_footer_btm {
	background: #ffeaea;
	border-radius: 0 0 6px 6px;
	text-align: center;
}
.agent_other {
	text-align: center;
}
.agent_other li {
	display: inline-block;
	margin: 15px 30px;
}
.agent_other li a {
	padding-right: 15px;
	display: inline-block;
	position: relative;
}
.agent_other li a:after {
	content: "";
	position: absolute;
    top: 50%;
	margin-top: -4px;
    right: 0;
    width: 8px;
    height: 8px;
    border-right: 2px solid #f23030;
    border-top: 2px solid #f23030;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
.entry_btm .agent_other li a {
	color: #f23030;
	font-size: 14px;
}
.entry_btm .agent_other li a:after {
    border-right: 2px solid #f23030;
    border-top: 2px solid #f23030;
}

@media screen and (max-width: 767px) {
	.topimg_pc {
		display: none;
	}.topimg_sp {
		display: block;
	}
	.topimg_sp_ttl {
		width: 100%;
		height: auto;
		margin-bottom: 20px;
	}
	.topimg_sp_btn {
		display: block;
		margin: 0 auto;
		width: 280px;
	}
	.topimg_sp_btn img {
		width: 280px;
		height: auto;
	}
	.agent_footer {
		font-size: 13px;
	}
	.agent_footer_top {
		text-align: center;
		padding: 20px 0;
	}
	.agent_footer_ul {
		position: static;
		text-align: left;
		margin: 0 auto;
		width: 90%;
	}
	.agent_footer_ul li {
		margin: 10px 0 0;
		display: block;
	}
	.agent_footer_img {
		max-width: 90%;
		height: auto;
	}
	.agent_other li {
		margin: 14px 8px;
	}
	.entry_btm {
		position: absolute;
		width: 130%;
		left: -15%;
		margin-top: 15px;
	}
}


@media screen and (min-width: 768px) and (max-width: 991px) {
	.content-box {
		margin-bottom: 30px;
	}
	#container {
		width: 720px;
	}
	.topimg_pc {
		background-size: 100% auto;
		height: 260px;
	}
	.topimg_ttl {
		left: 20px;
		top: 30px;
		width: 350px;
		height: auto;
	}
	.topimg_btn {
		left: 26px;
		top: 140px;
	}
	#reason-arrow > img {
		width: 680px !important;
		height: auto !important;
	}
	#reason section {
		width: 350px;
	}
	#reason section > h1 > img {
		width: 346px !important;
		height: auto !important;
	}
	.reason-arrow-inner img {
		width: 100% !important;
		height: auto !important;
	}
	#area {
		width: 720px;
	}
	#area .left img {
		width: 500px !important;
		height: auto !important;
	}
	#area .right img {
		width: 220px !important;
		height: auto !important;
	}
	.entry-box {
		width: 720px;
	}
	.entry-box h1 {
		left: 15px;
	}
	.entry-box .entry-btn {
		right: 15px;
	}
	#entry-bg img {
		width: 720px !important;
		height: auto !important;
		
	}
	#voice .comment {
		width: 580px;
		height: auto;
	}
	#voice .comment-right ,
	#voice .comment-left {
		background-image: none;
		background: #F2F6FC;
		border: 1px solid #D7DAE0;
		border-radius: 8px;
		padding: 10px 15px 0;
	}
	#appeal section {
		width: 680px !important;
		height: auto !important;
		margin: 0 20px 20px !important;
		padding: 20px 20px 10px !important;
	}
	#appeal section .right {
		width: 560px;
	}
	#flow-wrap {
		background-size: 719px auto;
		background-position: 0 27px;
	}
	#flow-wrap section {
		width: 136px;
		height: 220px;
	}
	#flow-wrap section > h1 > img {
		width: 139px !important;
		height: auto !important;
	}
	#flow-wrap section p {
		font-size: 13px;
		line-height: 1.3;
	}
	#medipass .right {
		width: 500px;
	}
	#medipass .left ,
	#medipass .left img {
		width: 200px !important;
		height: auto !important;
	}
	.agent_footer_top {
		text-align: center;
		padding: 20px 0 10px 30px;
	}
	.agent_footer_ul {
		position: static;
		text-align: left;
		margin-top: 10px;
	}
}