.inner { margin: 0 AUTO; position: RELATIVE; width: 1200px } .client { padding: 6em 0 } BODY { background-color: #222 } DIV#dvBody DIV#dvHeader { -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; background-color: RGBA(255, 255, 255, .85); box-shadow: 0 .3em 1em RGBA(0, 0, 0, .1); height: 8em; overflow: HIDDEN; position: FIXED; width: 100%; z-index: 1 } DIV#dvBody DIV#dvHeader:after { clear: BOTH; content: ''; display: BLOCK; font: 0/0 a } DIV#dvBody DIV#dvHeader .inner { position: RELATIVE } DIV#dvBody DIV#dvHeader .fnOpenmenu { cursor: POINTER; display: NONE; font-size: 3em; left: .65em; position: ABSOLUTE; top: .65em; z-index: 2 } DIV#dvBody DIV#dvHeader H1 { left: 0; position: ABSOLUTE; top: 1em } DIV#dvBody DIV#dvHeader H1 A { display: BLOCK } DIV#dvBody DIV#dvHeader H1 A IMG { width: 10em } DIV#dvBody DIV#dvHeader DIV#dvNavigation { position: ABSOLUTE; right: 0; top: 1.5em } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulTopmenu { font-size: .9em; margin-bottom: 1em; text-align: RIGHT } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulTopmenu LI { display: INLINE-BLOCK; margin-left: 1em } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulTopmenu LI H3 { } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulTopmenu LI A { color: #222; display: BLOCK; font-weight: 300 } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulTopmenu LI A:hover { color: #222; text-decoration: NONE } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu { text-align: RIGHT } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu LI { text-align: CENTER } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu LI.liClose { background-color: #222; display: NONE } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu LI.liClose A { cursor: POINTER; color: #3B8EDE } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu LI A { display: BLOCK } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu LI.selected H2 A, DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu LI A:hover { color: #3B8EDE; text-decoration: NONE } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu > LI { display: INLINE-BLOCK; vertical-align: TOP } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu > LI H2 { position: RELATIVE } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu > LI H2:after { border-left: 1px SOLID #DDD; content: ''; display: BLOCK; font: 0/0 a; height: 1rem; position: ABSOLUTE; left: 0; top: .75rem; width: 1px } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu > LI:first-child H2:after { display: NONE } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu > LI H2 A { display: BLOCK; padding: .5em 1.33em } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu > LI > UL { margin-top: 1em } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu > LI > UL > LI { } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu > LI > UL > LI H3 { } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu > LI > UL > LI H3 A { font-weight: 300; padding: .35em 0; max-width: 10em } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu > LI > UL > LI H3 A:hover { background-color: #3B8EDE; color: #FFF; font-weight: 700 } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu > LI.liClose > H2 > A { color: #FFF; border-radius: 1em } DIV#dvBody DIV#dvHeader.opened { border-bottom: 1px SOLID #EEE; height: 23em } DIV#dvBody DIV#dvMain { background-color: #FFF; position: RELATIVE } DIV#dvBody DIV#dvMain DIV#dvContent { } DIV#dvBody DIV#dvMain DIV#dvSubtitle { background-image: URL('./image/sub-visual.jpg'); background-position: CENTER; background-repeat: NO-REPEAT; background-size: COVER; padding: 11em 0 3em 0 } DIV#dvBody DIV#dvMain DIV#dvSubtitle H2 { font-size: 2em; font-weight: 300; line-height: 1em; padding: 1.5em .5em } DIV#dvBody DIV#dvMain DIV#dvSubtitle H2 STRONG { font-weight: 800 } DIV#dvBody DIV#dvMain DIV#dvSubtitle H2 SPAN { display: BLOCK; margin: .5em 0 } DIV#dvBody DIV#dvMain DIV#dvSubtitle.ABOUT { } DIV#dvBody DIV#dvMain DIV.dvMainInner { padding: 2em 0 } DIV#dvBody DIV#dvMain DIV.dvMainInner:after { clear: BOTH; content: ''; display: BLOCK; font: 0/0 a } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu { background-color: #FFF; float: LEFT; width: 20% } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu A { display: BLOCK } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu A:hover { text-decoration: NONE } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu H2 { font-size: 2em; font-weight: 700; padding: 1em .75em .8em; text-align: CENTER } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu H2 A { color: #222 } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu H2 A EM { color: #AAA; display: BLOCK; font-size: .5em; font-style: NORMAL; font-weight: 800; letter-spacing: .3em; margin-top: .5em } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu H3 A { padding: 1em } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu LI { position: RELATIVE } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu LI A { background-position: RIGHT; background-size: AUTO 100%; padding-right: 20% } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu LI A:hover { background-color: #F7F7F7 } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu LI.selected A { background-color: #3B8EDE; background-image: URL('./image/sub-navi-back.png'); color: #FFF } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu DIV.dvCSCenter { border: 1px SOLID #DDD; margin: 1em 0; padding: 2em } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu DIV.dvCSCenter H3 { font-size: 1.35em } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu DIV.dvCSCenter DIV.dvInformation { margin: .75em 0 } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu DIV.dvCSCenter DIV.dvInformation SPAN { display: BLOCK; margin: .1em 0 } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu DIV.dvCSCenter DIV.dvInformation SPAN.spTitle { font-size: 1.15em; font-weight: 700 } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu DIV.dvCSCenter DIV.dvInformation SPAN.spNumber { font-size: 1.75em; font-weight: 800; line-height: 1.35em } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu DIV.dvCSCenter DIV.dvInformation SPAN.spTimetable { color: #3B8EDE } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu DIV.dvCSCenter DIV.dvInformation SPAN.spAddress { line-height: 1.5em } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvContent { float: LEFT; margin-left: 5%; width: 75% } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvContent DIV#dvTitle { padding: 1em 0 } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvContent DIV#dvTitle H3 { font-size: 2.5em; font-weight: 300 } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvContent DIV#dvLocation { border-bottom: 1px SOLID #DDD; color: #CCC; padding: .8em 0 } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvContent DIV#dvLocation A:last-child { color: #3B8EDE; font-weight: 800 } DIV#dvFooter { background-color: #222; padding: 3em 0 } DIV#dvFooter:after { clear: BOTH; content: ''; display: BLOCK; font: 0/0 a } DIV#dvFooter DIV.dvLogo { float: LEFT } DIV#dvFooter DIV.dvLogo H1 { margin-bottom: 1em } DIV#dvFooter DIV.dvLogo H1 A { display: BLOCK } DIV#dvFooter DIV.dvLogo H1 A IMG { width: 8em } DIV#dvFooter DIV.dvLogo DIV.dvCopyright { color: #676767; line-height: 1.5em } DIV#dvFooter DIV.dvLogo DIV.dvCopyright SPAN { display: BLOCK } DIV#dvFooter UL#ulFootermenu { color: #FFF; float: RIGHT; text-align: CENTER } DIV#dvFooter UL#ulFootermenu > LI { margin-left: 4em } DIV#dvFooter UL#ulFootermenu LI { display: INLINE-BLOCK; vertical-align: TOP } DIV#dvFooter UL#ulFootermenu LI A { color: #AAA; display: BLOCK; padding: .5em 0 } DIV#dvFooter UL#ulFootermenu LI A:hover { color: #FFF; text-decoration: NONE } DIV#dvFooter UL#ulFootermenu LI H2 { font-size: 1.25em } DIV#dvFooter UL#ulFootermenu LI H3 { font-size: 1em } DIV#dvFooter UL#ulFootermenu LI H3 A { color: #676767; font-weight: 300 } DIV#dvFooter UL#ulFootermenu LI UL LI { display: BLOCK } @media only screen and (max-width: 1200px) { .inner { margin: 0; padding: 0 1em; width: AUTO } DIV#dvBody DIV#dvHeader { height: 8em } DIV#dvBody DIV#dvHeader H1 { left: 1em } DIV#dvBody DIV#dvHeader H1 A IMG { width: 9em } DIV#dvBody DIV#dvHeader DIV#dvNavigation { right: 1em } } @media only screen and (max-width: 800px) { DIV#dvBody DIV#dvHeader { -webkit-overflow-scrolling: touch; background-color: RGBA(255, 255, 255, .95); height: AUTO; overflow-y: AUTO; padding: 0; z-index: 10 } DIV#dvBody DIV#dvHeader .fnOpenmenu { display: BLOCK; top: .3em } DIV#dvBody DIV#dvHeader H1 { padding: .5em 0; position: STATIC; text-align: CENTER } DIV#dvBody DIV#dvHeader H1 A IMG { width: 5em } DIV#dvBody DIV#dvHeader DIV#dvNavigation { display: BLOCK; position: STATIC } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu { display: NONE; text-align: CENTER } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu > LI { display: BLOCK; margin: 1em 0; width: 100% } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu > LI A { padding: 1em 0 !IMPORTANT } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulMainmenu LI.liClose { display: BLOCK } DIV#dvBody DIV#dvHeader DIV#dvNavigation UL#ulTopmenu { display: NONE } DIV#dvBody DIV#dvHeader.opened { height: 100% } DIV#dvBody DIV#dvHeader.opened DIV#dvNavigation UL#ulMainmenu { display: BLOCK } DIV#dvBody DIV#dvMain DIV#dvSubtitle { padding: 0; text-align: CENTER } DIV#dvBody DIV#dvMain DIV#dvSubtitle .inner { padding: 0 } DIV#dvBody DIV#dvMain DIV#dvSubtitle h2 { background-color: RGBA(19, 158, 195, .75); color: #FFF; font-size: 1.25em; padding: 6em 0 2em } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvSidemenu { display: NONE } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvContent { float: NONE; margin: 0; width: AUTO } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvContent DIV#dvTitle { padding: 0 } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvContent DIV#dvTitle H3 { line-height: 1em; text-align: CENTER } DIV#dvBody DIV#dvMain DIV.dvMainInner DIV#dvContent DIV#dvLocation { text-align: CENTER } DIV#dvFooter DIV.dvLogo { float: NONE; text-align: CENTER } DIV#dvFooter DIV.dvLogo H1 A IMG { width: 5em } DIV#dvFooter DIV.dvLogo DIV.dvCopyright SPAN { display: INLINE } DIV#dvFooter UL#ulFootermenu { float: NONE; margin-top: 3em; text-align: CENTER } DIV#dvFooter UL#ulFootermenu > LI { display: BLOCK; margin: 1em } }