@charset "utf-8";
@font-face { font-family: 'theanodidot';src: url('../../webfonts/theanodidot-regular-webfont.woff') format('woff'); }

/*-------------------------------------------------------------------------
	株式会社DYM
	Style Sheet for Common Setting
	Date: 2015-01
	All content (c) RYNAPSE
-------------------------------------------------------------------------*/

/* =page structure
-------------------------------------------------------------------------*/
html,body {
	width: 100%;
	overflow-x: hidden;
	}

html {
	height: 100%;
	font: 10px/1 HelveticaNeue,'Helvetica Neue',Helvetica,ArialMT,Arial,'Hiragino Sans','Hiragino Kaku Gothic ProN',Roboto,'Droid Sans','Yu Gothic',Meiryo,'Meiryo UI',sans-serif;
	}

body {
	min-height: 100%;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

#articles { position: relative; }
.print { display: none; }


/* =icons
-------------------------------------------------------------------------*/
p.next a:after,
p.notice:before,
ol.step li.current:before,
dl.wicket dd a:before,
nav.secondary dd a:before,
#connect div li a:before,
.message .pkg li:before,
#csr .pkg figure figcaption li:before,
p.btn button:before,
.confirm dt:before,
.confirm h3:before {
	font-weight: normal !important;
	font-family: 'FontAwesome';
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}


/* =tags
-------------------------------------------------------------------------*/
p,dt,dd,li {
	font-size: 1.3rem;
	line-height: 1.8;
	}

p {
	text-align: justify;
	margin: 0 0 2em;
	}

p.next {
	width: auto;
	font-weight: 600;
	font-family: "Hiragino Sans","Hiragino Kaku Gothic ProN",Roboto,'Droid Sans','Yu Gothic',Meiryo,'Meiryo UI',sans-serif;
	letter-spacing: .1em;
	}

p.next a {
	display: inline-block;
	height: 5em;
	line-height: 5em;
	padding: 0 35px 0 40px;
	background: #E6ECF3;
	border-radius: 3px;
	transition: all .2s;
		-webkit-transition: all .2s;
		-moz-transition: all .2s;
		-ms-transition: all .2s;
	}

p.next a:after {
	content: '\f105';
	margin-left: 10px;
	}

p.next a:hover {
	color: #FFF;
	background: #131B3F;
	}

p.notice {
	font-size: 1.2rem;
	color: #A5013E;
	}

p.notice:before {
	content: '\f111';
	margin-right: 5px;
	}

ul,ol,dl {
	margin: 0;
	list-style-type: none;
	}

ul.signature { margin: 30px 0; }
ul.signature li { text-align: right; }

ol.step li {
	text-align: right;
	line-height: 2.4;
	color: #999;
	}

ol.step li.current { color: #131B3F; }

ol.step li.current:before {
	content: '\f061';
	font-size: 2rem;
	line-height: 1;
	margin-right: .5em;
	}

dl.list-table { margin: 20px 0; }

dl.list-table dt {
	margin-top: 30px;
	font-weight: 600;
	font-family: "Hiragino Sans","Hiragino Kaku Gothic ProN",Roboto,'Droid Sans','Yu Gothic',Meiryo,'Meiryo UI',sans-serif;
	letter-spacing: .1em;
	}

dl.list-table>dd dl {
	margin: 1em 0 0;
	padding: .5em 0 2em 10px;
	border-left: 1px solid rgba(0,0,0,.8);
	}

dl.list-table>dd dl dt { margin-top: 0; }

dl.list-table>dd strong {
	display: block;
	font-weight: 600;
	font-family: "Hiragino Sans","Hiragino Kaku Gothic ProN",Roboto,'Droid Sans','Yu Gothic',Meiryo,'Meiryo UI',sans-serif;
	font-size: 2.4rem;
	}

dl.list-table>dd em {
	display: block;
	font-size: 1.6rem;
	}

dl.list-table>dd a {
	display: inline-block;
	font-size: 1.6rem;
	margin: .5em 0;
	padding: 0 10px;
	color: #131B3F;
	background: #EEE;
	}

dl.list-table>dd a:hover { background: #DDD; }

dl.list-table>dd dd.map a {
	font-weight: 400;
	font-family: 'Nunito',sans-serif;
	font-size: 1.4rem;
	text-transform: uppercase;
	color: #FFF;
	background: #131B3F;
	border-radius: 3px;
	}

dl.list-table>dd dt { margin: 1em 0; }
dl.list-table>dd span { display: inline-block; }

dl.wicket { margin: 2em 0; }
dl.wicket dd span { display: inline-block; }

dl.wicket dd a {
	font-weight: 400;
	font-family: 'Nunito',sans-serif;
	font-size: 1.4rem;
	color: #000;
	}

dl.wicket dd a:before {
	content: '\f095';
	margin-right: 5px;
	}


/* =#masthead
-------------------------------------------------------------------------*/
#masthead {
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	background: rgba(255,255,255,.9);
	box-shadow: 0 1px 20px 3px rgba(0,0,0,.1);
	z-index: 1000;
	}
@media screen and (min-width: 721px) {
	#masthead{
		height: 60px;
	}
}

/* =.breadcrumb
-------------------------------------------------------------------------*/
.breadcrumb {
	margin: 10px 20px;
	border-bottom: 1px solid #EEE;
	}

.breadcrumb a {
	display: inline-block;
	padding: 1em 0;
	font-size: 1.1rem;
	letter-spacing: 1px;
	vertical-align: baseline;
	}
.breadcrumb>li{
	display: inline;
}

.breadcrumb>span:after,
.breadcrumb>li:after {
	content: '\00203A';
	display: inline-block;
	font-size: 2.4rem;
	/* vertical-align: bottom; */
	margin: 0 5px .4em 10px;
	}

.breadcrumb>span:last-of-type:after { content: ''; }
.breadcrumb>li:last-of-type:after { content: ''; }

.breadcrumb>span:first-of-type a,
.breadcrumb>li:first-of-type a {
	font-weight: 300;
	font-family: 'Nunito',sans-serif;
	font-size: 1.3rem;
	text-transform: uppercase;
	}


/* =.secondary
-------------------------------------------------------------------------*/
nav.secondary dt {
	display: inline-block;
	padding: 0 10px;
	font-weight: 400;
	font-family: 'Nunito',sans-serif;
	font-size: 1.4rem;
	color: #FFF;
	background: #131B3F;
	border: 1px solid #131B3F;
	border-radius: 3px;
	}

nav.secondary dt.close {
	color: #131B3F;
	background: #FFF;
	border-color: #131B3F;
	}

nav.secondary dd a {
	display: block;
	line-height: 2.4;
	color: #999;
	}

nav.secondary dd a:hover,
.outline nav.secondary dd a:nth-child(1),
.access nav.secondary dd a:nth-child(2),
.history nav.secondary dd a:nth-child(3),
.message nav.secondary dd a:nth-child(4),
.board-member nav.secondary dd a:nth-child(5),
.advisor nav.secondary dd a:nth-child(6),
.web-promotion nav.secondary dd a:nth-child(1),
.new-graduates nav.secondary dd a:nth-child(2),
.training nav.secondary dd a:nth-child(3),
.exe-part nav.secondary dd a:nth-child(4),
.medicine nav.secondary dd a:nth-child(5),
.new-business nav.secondary dd a:nth-child(6),
.employee nav.secondary dd a:nth-child(1),
.welfare nav.secondary dd a:nth-child(2),
#news.a2018 nav.secondary dd a:nth-last-child(13),
#news.a2017 nav.secondary dd a:nth-last-child(12),
#news.a2016 nav.secondary dd a:nth-last-child(11),
#news.a2015 nav.secondary dd a:nth-last-child(10),
#news.a2014 nav.secondary dd a:nth-last-child(9),
#news.a2013 nav.secondary dd a:nth-last-child(8),
#news.a2012 nav.secondary dd a:nth-last-child(7),
#news.a2011 nav.secondary dd a:nth-last-child(6),
#news.a2010 nav.secondary dd a:nth-last-child(5),
#news.a2009 nav.secondary dd a:nth-last-child(4),
#news.a2008 nav.secondary dd a:nth-last-child(3),
#news.a2007 nav.secondary dd a:nth-last-child(2),
#news:not([class]) nav.secondary dd a:last-child { color: #131B3F; }

nav.secondary dd a:before {
	content: '\f111';
	margin-right: 10px;
	}


/* =article
-------------------------------------------------------------------------*/
article { padding: 0 20px 20px; }
article>figure { text-align: left; }

article>header h1 {
	font-weight: normal;
	font-size: 3rem;
	font-family: Didot,'theanodidot',serif;
	text-transform: uppercase;
	margin: 0 0 30px;
	}

article>header h1 span {
	display: block;
	font-weight: 600;
	font-family: "Hiragino Sans","Hiragino Kaku Gothic ProN",Roboto,'Droid Sans','Yu Gothic',Meiryo,'Meiryo UI',sans-serif;
	font-size: 1.4rem;
	letter-spacing: 1px;
	margin: .5em 0 0;
	}

article>header h2 {
	font-size: 2rem;
	margin: -15px 0 30px;
	}

article>header h2:before {
	content: '';
	display: block;
	width: 50%;
	height: 4px;
	margin: 0 0 .5em;
	background: #000;
	}

.index article nav figure,
.index .external figure {
	position: relative;
	height: 180px;
	margin: 0 0 1px;
	text-align: left;
	background: #000;
	overflow: hidden;
	}

.index article figure a { display: block; }

.index article nav figure img,
.index .external figure img {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 104%;
	max-width: none;
	min-height: 101%;
	opacity: .9;
	transform: translate(-50%,-50%);
		-webkit-transform: translate(-50%,-50%);
		-moz-transform: translate(-50%,-50%);
		-ms-transform: translate(-50%,-50%);
	-webkit-user-drag: none;
}
.index article nav figure.advisor3 img,
.index article nav figure.advisor4 img,
.index article nav figure.advisor5 img{
	object-fit: contain !important;
}
.index article nav figure figcaption,
.index .external figure figcaption {
	position: absolute;
	left: 20px;
	bottom: 20px;
	font-weight: 600;
	font-family: "游明朝","YuMincho",HiraMinProN-W6,"Hiragino Mincho ProN",Meiryo,serif;
	font-size: 1.8rem;
	color: #FFF;
	z-index: 10;
	}

.headerlogo {
	display: inline-block;
	width: 6%;
	height: auto;
}
@media (max-width: 768px) {
	.headerlogo {
		margin: 15px auto;
		width: 100px;
		display: block;
	}	
}

.serviceheader {
    margin: 0 0 60px;
    font-size: 5rem;
}

.serviceheader div {
    font-family: Didot,'theanodidot',serif;
    text-transform: uppercase;
}

.serviceheader span {
    display: block;
    font-size: 1.4rem;
    font-family: "Hiragino Sans","Hiragino Kaku Gothic ProN",Roboto,'Droid Sans','Yu Gothic',Meiryo,'Meiryo UI',sans-serif;
    font-weight: 600;
    letter-spacing: 1px;
    margin: 0.5em 0 0;
}

/* =#connect
-------------------------------------------------------------------------*/
#connect {
	position: relative;
	height: 21em;
	color: #FFF;
	background: #000;
	}

#connect>span {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	background: url("/images/temp/connect.jpg") no-repeat 50% 40%;
	background-size: cover;
	z-index: 0;
	opacity: .8;
	}

#connect div {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 90%;
	text-align: center;
	z-index: 10;
	transform: translate(-50%,-50%);
		-webkit-transform: translate(-50%,-50%);
		-moz-transform: translate(-50%,-50%);
		-ms-transform: translate(-50%,-50%);
	}

#connect div h1,
#connect div p { text-align: center; }

#connect div h1 {
	font-size: 1.6rem;
	margin: 0 0 1em;
	}

#connect div p { font-size: 1.2rem; }
#connect div p span { display: inline-block; }

#connect div ul {
	display: table;
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
	}

#connect div li {
	display: table-cell;
	width: 50%;
	line-height: 1.2;
	text-align: center;
	vertical-align: middle;
	}

#connect div li a {
	display: block;
	font-weight: 600;
	font-family: "Hiragino Sans","Hiragino Kaku Gothic ProN",Roboto,'Droid Sans','Yu Gothic',Meiryo,'Meiryo UI',sans-serif;
	margin: 0 !important;
	}

#connect div li a[href^="tel:"] {
	font-weight: 400;
	font-family: 'Nunito',sans-serif;
	font-size: 1.1em;
	}

#connect div li a:before {
	display: block;
	content: '\f003';
	font-size: 6rem;
	margin: 0 0 5px;
	}

#colophon footer div img[alt="東京都スポーツ推進企業認定ロゴ"] {
	height: 90%;
}

#connect div li a[href^="tel:"]:before {
	content: '\f095';
	margin: 5px 0 0;
	}

.footerconnect {
		font-weight: normal;
		font-size: 3.6rem;
		margin: -3em 0 0.5em;
		text-align: center;
	}


/* =#colophon
-------------------------------------------------------------------------*/
#colophon { clear: both; }

#colophon footer {
	color: #FFF;
	margin: 0;
	padding: 50px 20px 20px;
	background: #131B3F;
	text-align: center;
	}

#colophon footer div {
    height: 112.5px;
	margin: 0 0 5px;
	text-align: left;
	}

#colophon footer div img[alt="DYM"] {
	display: inline-block;
	width: 120px;
	padding: 41.25px 0;
}

#colophon footer div img[alt="Privacy Mark"] {
    background: #fff;
    box-sizing: border-box;
    float: right;
    height: 90%;
    padding: 0.8%;
}

#colophon footer div img[alt="健康経営優良法人2024"] {
	background: #fff;
	box-sizing: border-box;
	float: right;
    height: 90%;
    padding: 0.3%;
}

#colophon footer p {
	font-size: 1.1rem;
	text-align: left;
	margin: 0;
	padding-top: 1em;
	border-top: 1px solid rgba(255,255,255,.3);
	}

#colophon footer li {
	display: inline-block;
	margin: 0 10px .5em 0;
	}

#colophon footer li a {
	opacity: .8;
	transition: opacity .2s;
		-webkit-transition: opacity .2s;
		-moz-transition: opacity .2s;
		-ms-transition: opacity .2s;
	}

#colophon footer li a:hover { opacity: 1; }


/* =p#gotop
-------------------------------------------------------------------------*/
p#gotop { margin: 0; }

p#gotop a {
	position: relative;
	display: block;
	width: 100%;
	height: 60px;
	text-indent: 120%;
	white-space: nowrap;
	border-top: 1px solid rgba(255,255,255,.3);
	overflow: hidden;
	background: #131B3F;
	}

p#gotop a:after {
	content: '';
	position: absolute;
	top: 40%;
	left: 50%;
	display: block;
	width: 15px;
	height: 15px;
	border-top: 1px solid #FFF;
	border-left: 1px solid #FFF;
	transform: translateX(-50%) rotate(45deg);
		-webkit-transform: translateX(-50%) rotate(45deg);
	}

.aword-image {background: url(/images/temp/about/22season-award.jpg) no-repeat 50% 38%;background-size: contain; top: 0;left: 0;bottom: 0;width: 100%;margin-bottom: 1em;}

.dym-movie{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.headoffice{
	padding-bottom: 2em;
}

.entrancemovie{
	padding: 20px 0 0 0;
}

/* =Media Query
-------------------------------------------------------------------------*/
@media only screen and ( max-device-width: 320px ) and ( orientation: landscape ) {
	.index article nav figure,.index .external figure { height: 180px !important; }
	}

@media only screen and ( min-device-width: 321px ) {
	.breadcrumb a { font-size: 1.3rem; }
	.index article nav figure,.index .external figure { height: 220px; }
	}

@media only screen and ( min-device-width: 376px ) {
	.index article nav figure,.index .external figure { height: 240px !important; }
	#connect div h1 { font-size: 2rem; }
	#connect div p,#connect div li { font-size: 1.4rem; }
	}

@media
only screen and ( orientation: landscape ),
only screen and ( min-device-width: 721px ) {
	.index article nav,.index .external { overflow: hidden; }
	.index article nav figure,.index .external figure { width: 50%; height: 220px; margin: 0; float: left; }
	}

@media only screen and ( min-device-width: 721px ) {
	article { padding: 0 40px 60px; }
	article>header h1 { font-size: 5rem; margin: 0 0 60px; }
	article>header h2 { font-size: 2.4rem;}
	#news:not([class]) article>header h1 { font-size: 5rem; margin: 0 0 250px; }
	#news.dig article>header h2 { font-size: 2.4rem; margin: -45px 0 190px; }
	article>header h2:before { width: 25%; }
	}

@media
only screen and ( min-device-width: 721px ) and ( orientation: landscape ),
only screen and ( min-width: 1025px ) {
	.index article nav,.index .external { margin-left: 25%; }
	.index article nav figure,.index .external figure { height: 300px; }
	.index article nav figure.top img { top: -40px !important; transform: translate(-50%,0); -webkit-transform: translate(-50%,0); -moz-transform: translate(-50%,0); -ms-transform: translate(-50%,0); }
	.index article nav figure.advisor4 img, .index article nav figure.advisor5 img { top: 0px !important; transform: translate(-50%,0); -webkit-transform: translate(-50%,0); -moz-transform: translate(-50%,0); -ms-transform: translate(-50%,0); }
	#about.index article nav figure.adjust img { top: 24% !important; }
	}
@media only screen and ( min-width: 1025px ) {
	article { padding: 0 60px 10em; }
	#connect { height: 60em; background-image: url("/images/temp/connect.jpg") no-repeat 50% 14%; }
	#connect div h1 { font-weight: normal; font-size: 3.6rem; margin: 0 0 .5em; }
	#connect div p,#connect div li { font-size: 2rem; }
	#colophon footer { padding: 100px 4% 40px; }
	}
@media screen and (min-width: 1024px) and (max-width: 1440px){
	#about.index article nav figure.adjust img { top: 50% !important; }
	.index article nav figure.top img{ top: -1% !important;}
}

/* スクリーンサイズが767px以下の場合に適用 */
@media screen and (max-width: 767px) {
	.dym-movie iframe {
    width: 100%;
    height: 100%;
	}
	.footerconnect {
		text-align: center;
		font-size: 1.6rem;
		margin: 0 0 1em;
	}
} 

.nonetrancate {
  position: absolute;
  top: 0px!important;
  left: 0px!important;
  transform: none!important;
  -webkit-transform: none!important;
  -moz-transform: none!important;
  -ms-transform: none!important;
}

.olborder {
  border-bottom: 2px solid #f2f2f2;	
}

/* EOF
-------------------------------------------------------------------------*/
img[src$="ng022.png"] {
    max-width: 40%;
}

@media
only screen and ( min-device-width: 721px ) {
	.slide {
    display: flex;
    width: 100%;
}

.w-half {
    width: 50%;
}

.dym-color {
	background-color: #131B3F;
}
}