guestuseer .RdCenter { text-align: center; } .RdBlockWord { white-space: nowrap; } span.RdSpeaker { color: rgb(0, 27, 112); font-weight: bold; margin-right: 15px; } span.RdSpeaker2 { color: rgb(0, 27, 112); font-size: 130%; font-weight: normal; margin-right: 15px; } p.RdTextStyle1 { margin: 0px 0px 5px; line-height: 1.5; font-size: 90%; } p.RdTextStyle1 a { line-height: 1.5; } p.RdTextStyle2 { margin: -10px 0px 8px; line-height: 1.5; font-size: 83%; } p.RdTextStyle2 a { line-height: 1.5; } h2.midashi { font-size: 26px; background-image: none; } p.midashi_text { font-size: 15px; margin-bottom: 30px; } .RdSocial { margin-bottom: 20px; } .RdSocial div { padding-left: 10px; float: right; display: inline-block; } .RdSocial div.Facebook { width: auto; } .RdSocial div.Linkedin { width: auto; } .RdSocial div.Twitter { width: auto; } .RdSocial div.Hatena { width: auto; } .RdSocial div.Line { width: auto; } .RdSocial div.Googleplus { width: 60px; } .fb_iframe_widget > span { vertical-align: baseline !important; } img.Rdpreload { display: none; } img.RdArchiveListImg { vertical-align: top; } img.RdImgBorder1 { border-width: 1px; border-style: solid; border-color: rgb(238, 238, 238) rgb(136, 136, 136) rgb(136, 136, 136) rgb(238, 238, 238); } img.RdImgBorder2 { border: 1px solid rgb(136, 136, 136); } div.RdImgW50SetStyle { width: 230px; } div.RdImgW50SetStyle p.Img { margin: 3px 3px 0px -3px; width: 50px; padding-bottom: 15px; float: left; } html[xmlns*=''] body:last-child div.RdImgW50SetStyle { margin: 0px 0px 1px; } * html body div.RdImgW50SetStyle p.Img { margin: 0px; } div.RdImgW50SetStyle div.ImgSet dt { margin: 0px 0px 3px; } div.RdImgW50SetStyle div.ImgSet dd { margin: 0px 0px 3px; } div.RdImgW50SetStyle::after { height: 0px; clear: both; display: block; visibility: hidden; content: "."; } div.RdImgW50SetStyle { display: inline-block; } * html div.RdImgW50SetStyle { height: 1%; } div.RdImgW50SetStyle { display: block; } .Rd2ImgLeftSide { margin: 0px; text-align: left; float: left; } .Rd2ImgRightSide { margin: 0px; text-align: left; float: right; } .Rd2ImgLeftSide .ImgOnlyStyle { margin: 0px 0px 10px; } .Rd2ImgRightSide .ImgOnlyStyle { margin: 0px 0px 10px; } .RdBox { margin-bottom: 17px; border-bottom-color: rgb(221, 221, 221); border-bottom-width: 1px; border-bottom-style: solid; } .RdBoxFixHeight1 { height: 275px; } @media screen and (max-width:994px){ .JS .RdBox { margin-bottom: 17px; } } @media screen and (max-width:767px){ .JS .RdBox { margin-bottom: 0px; border-bottom-color: currentColor; border-bottom-width: medium; border-bottom-style: none; } .JS .RdBoxFixHeight1 { height: auto; } } .RdBoxPatternA { margin: 0px 0px 15px; padding: 15px 0px 0px; clear: both; background-color: rgb(242, 242, 242); } .RdBoxPatternA::after { clear: both; display: block; content: ""; } .RdBoxPatternA .Title { margin: -15px 0px 15px; padding: 8px 15px; border: currentColor; border-image: none; color: rgb(255, 255, 255); line-height: 130%; font-size: 96%; font-weight: normal; min-height: 20px; background-color: rgb(115, 115, 115); } .RdBoxPatternA h2 { margin: -15px 0px 15px; padding: 8px 15px; border: currentColor; border-image: none; color: rgb(255, 255, 255); line-height: 130%; font-size: 96%; font-weight: normal; min-height: 20px; background-color: rgb(115, 115, 115); } .RdBoxPatternA h3 { margin: -15px 0px 15px; padding: 8px 15px; border: currentColor; border-image: none; color: rgb(255, 255, 255); line-height: 130%; font-size: 96%; font-weight: normal; min-height: 20px; background-color: rgb(115, 115, 115); } .RdBoxPatternA h4 { margin: -15px 0px 15px; padding: 8px 15px; border: currentColor; border-image: none; color: rgb(255, 255, 255); line-height: 130%; font-size: 96%; font-weight: normal; min-height: 20px; background-color: rgb(115, 115, 115); } .RdBoxPatternA h2 { background-image: none; } .RdBoxPatternA .Title a { background-position: right; margin: -8px -15px; display: block; min-height: 20px; background-image: url("/image/jp/r1/icon/icon_link_right_l_white_hd.gif") !important; background-repeat: no-repeat; background-size: 16px 16px; -moz-background-size: 16px 16px; -webkit-background-size: 16px 16px; -o-background-size: 16px 16px; -ms-background-size: 16px 16px; } .RdBoxPatternA h2 a { background-position: right; margin: -8px -15px; display: block; min-height: 20px; background-image: url("/image/jp/r1/icon/icon_link_right_l_white_hd.gif") !important; background-repeat: no-repeat; background-size: 16px 16px; -moz-background-size: 16px 16px; -webkit-background-size: 16px 16px; -o-background-size: 16px 16px; -ms-background-size: 16px 16px; } .RdBoxPatternA h3 a { background-position: right; margin: -8px -15px; display: block; min-height: 20px; background-image: url("/image/jp/r1/icon/icon_link_right_l_white_hd.gif") !important; background-repeat: no-repeat; background-size: 16px 16px; -moz-background-size: 16px 16px; -webkit-background-size: 16px 16px; -o-background-size: 16px 16px; -ms-background-size: 16px 16px; } .RdBoxPatternA h4 a { background-position: right; margin: -8px -15px; display: block; min-height: 20px; background-image: url("/image/jp/r1/icon/icon_link_right_l_white_hd.gif") !important; background-repeat: no-repeat; background-size: 16px 16px; -moz-background-size: 16px 16px; -webkit-background-size: 16px 16px; -o-background-size: 16px 16px; -ms-background-size: 16px 16px; } .RdBoxPatternA .Title a:link { padding: 8px 22px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 3px; border-right-style: solid; background-color: rgb(230, 0, 39); } .RdBoxPatternA h2 a:link { padding: 8px 22px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 3px; border-right-style: solid; background-color: rgb(230, 0, 39); } .RdBoxPatternA h3 a:link { padding: 8px 22px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 3px; border-right-style: solid; background-color: rgb(230, 0, 39); } .RdBoxPatternA h4 a:link { padding: 8px 22px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 3px; border-right-style: solid; background-color: rgb(230, 0, 39); } .RdBoxPatternA .Title a:visited { padding: 8px 22px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 3px; border-right-style: solid; background-color: rgb(230, 0, 39); } .RdBoxPatternA h2 a:visited { padding: 8px 22px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 3px; border-right-style: solid; background-color: rgb(230, 0, 39); } .RdBoxPatternA h3 a:visited { padding: 8px 22px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 3px; border-right-style: solid; background-color: rgb(230, 0, 39); } .RdBoxPatternA h4 a:visited { padding: 8px 22px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 3px; border-right-style: solid; background-color: rgb(230, 0, 39); } .RdBoxPatternA .Title a:hover { padding: 8px 24px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 1px; border-right-style: solid; background-color: rgb(177, 0, 14); } .RdBoxPatternA h2 a:hover { padding: 8px 24px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 1px; border-right-style: solid; background-color: rgb(177, 0, 14); } .RdBoxPatternA h3 a:hover { padding: 8px 24px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 1px; border-right-style: solid; background-color: rgb(177, 0, 14); } .RdBoxPatternA h4 a:hover { padding: 8px 24px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 1px; border-right-style: solid; background-color: rgb(177, 0, 14); } .RdBoxPatternA .Title a:active { padding: 8px 24px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 1px; border-right-style: solid; background-color: rgb(177, 0, 14); } .RdBoxPatternA h2 a:active { padding: 8px 24px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 1px; border-right-style: solid; background-color: rgb(177, 0, 14); } .RdBoxPatternA h3 a:active { padding: 8px 24px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 1px; border-right-style: solid; background-color: rgb(177, 0, 14); } .RdBoxPatternA h4 a:active { padding: 8px 24px 8px 15px; color: rgb(255, 255, 255); text-decoration: none; border-right-color: transparent; border-right-width: 1px; border-right-style: solid; background-color: rgb(177, 0, 14); } .RdBoxPatternA .Title strong { color: rgb(255, 255, 255); font-weight: normal; } .RdBoxPatternA .BoxImgStyle { margin: -15px 0px 15px; padding: 0px; } .RdBoxPatternA .ImgOnlyStyle { margin-bottom: 10px; } .RdBoxPatternA p { padding-right: 15px; padding-left: 15px; margin-bottom: 10px; } .RdBoxPatternA ul { padding-right: 15px; padding-left: 15px; margin-bottom: 10px; } .RdBoxPatternA dl { padding-right: 15px; padding-left: 15px; margin-bottom: 10px; } .RdBoxPatternA .ThumbW60SetStyle .Img { padding-right: 5px; } .RdBoxPatternA .ThumbW120SetStyle .Img { padding-right: 5px; } .RdBoxPatternA .ThumbW180SetStyle .Img { padding-right: 5px; } .RdBoxPatternA .ThumbW230SetStyle .Img { padding-right: 5px; } .RdBoxPatternA .ImgW120SetStyle .ImgSet { margin-left: -150px; } .RdBoxPatternA .ImgW180SetStyle .ImgSet { margin-left: -210px; } .RdBoxPatternA .ImgW230SetStyle .ImgSet { margin-left: -270px; } .RdImgHeadingSet .Title h3 { line-height: 140%; font-size: 83%; } .RdImgHeadingSet img.category { margin-bottom: 7px; } .keisen_p { font-weight: bold; margin-top: 70px; margin-bottom: 20px !important; } .person_name { font-weight: bold; } .keisen { letter-spacing: -5px; } @media screen and (max-width:767px){ .JS .Grid4 .RdImgHeadingSet .Column1 { width: 50%; float: left; } .JS .Grid4 .RdImgHeadingSet :nth-child(3).Column1 { clear: both; } .JS .Grid4 .RdImgHeadingSet :nth-child(4).Column1 { clear: none; } .JS .RdImgHeadingSet img.thum { width: 100%; } } @media screen and (max-width:399px){ .JS .RdImgHeadingSet { width: auto; } .JS .Grid4 .RdImgHeadingSet .Column1 { width: auto; float: none; } .JS .RdImgHeadingSet { margin-bottom: 10px; } .JS .RdImgHeadingSet .Img { margin: 0px 15px 15px 0px; width: 80px; float: left; } .JS .RdImgHeadingSet .Title { margin: 0px; width: auto; position: static; } .JS .RdImgHeadingSet .Title h3 { margin: 0px 0px 10px 95px; padding: 0px; color: rgb(112, 112, 112); font-size: 86%; font-weight: bold; background-image: none; } .JS .RdImgHeadingSet .Title h3 a { background-position: right !important; margin: 0px; padding: 0px 17px 0px 0px !important; font-weight: bold; border-right-color: currentColor !important; border-right-width: medium !important; border-right-style: none !important; display: inline-block; background-repeat: no-repeat !important; background-size: 16px 16px; -moz-background-size: 16px 16px; -webkit-background-size: 16px 16px; -o-background-size: 16px 16px; -ms-background-size: 16px 16px; } .JS .RdImgHeadingSet .Title h3 a:link { color: rgb(112, 112, 112); background-image: url("/image/jp/r1/icon/icon_link_right_l_hd.gif") !important; } .JS .RdImgHeadingSet .Title h3 a:visited { color: rgb(112, 112, 112); background-image: url("/image/jp/r1/icon/icon_link_right_l_hd.gif") !important; } .JS .RdImgHeadingSet .Title h3 a:hover { color: rgb(177, 0, 14); background-image: url("/image/jp/r1/icon/icon_link_right_l_hover_hd.gif") !important; } .JS .RdImgHeadingSet .Title h3 a:active { color: rgb(177, 0, 14); background-image: url("/image/jp/r1/icon/icon_link_right_l_hover_hd.gif") !important; } .JS .RdImgHeadingSet.hover .Title h3 a { color: rgb(177, 0, 14); background-image: url("/image/jp/r1/icon/icon_link_right_l_hover_hd.gif") !important; } .JS .Column1 .RdImgHeadingSet ~ p { margin: 0px 0px 15px 95px; } .JS .Column1 .RdImgHeadingSet ~ ul { margin: -5px 0px 15px 95px; } .JS .Column1 .RdImgHeadingSet ~ p + ul { margin-top: -10px; } } .main_img_box { left: 0px; top: 0px; width: 100%; margin-top: 240px; position: absolute; } .main_img_box_inner { margin: 0px auto; text-align: center; position: relative; min-height: 250px; } .main_img_box_inner h1 { line-height: 250px; font-size: 30px; } div.RdStoryBannerWithPhotoSet { margin-left: 10px; } .RdStoryBannerWithPhotoSet p { color: rgb(255, 255, 255); } .RdStoryBannerWithPhotoSet ul li a { color: rgb(255, 255, 255); text-decoration: none; background-image: url("/image/jp/r1/icon/icon_link_right_l_white.gif") !important; } .RdStoryBannerWithPhotoSet ul li a:visited { color: rgb(255, 255, 255); text-decoration: none; background-image: url("/image/jp/r1/icon/icon_link_right_l_white.gif") !important; } .RdStoryBannerWithPhotoSet ul li a:link { color: rgb(255, 255, 255); text-decoration: none; background-image: url("/image/jp/r1/icon/icon_link_right_l_white.gif") !important; } .RdStoryBannerWithPhotoSet ul li a:hover { color: rgb(167, 249, 254); text-decoration: underline; } .RdStoryBannerWithPhotoSet ul li a:active { color: rgb(167, 249, 254); text-decoration: underline; } .rd_linkbtn_box { padding-top: 300px; margin-bottom: 30px; } .rd_linkbtn_box a { float: right; } div.RdStoryTab { margin-bottom: 15px; background-color: rgb(234, 234, 234); } div.RdStoryTab img { margin-right: 2px; float: left; } div.RdStoryTab a:last-child img { margin-right: 0px; } div.RdStoryBox { width: 230px; margin-bottom: 9px; margin-left: 9px; } div.RdStoryBoxCol2 { width: 469px; margin-bottom: 9px; margin-left: 9px; } div.RdPageIndex { background: rgb(238, 238, 238); margin: 5px 0px 15px; } div.RdPageIndex ul { padding: 5px 10px; } div.RdPageIndex ul li { padding: 5px 0px 5px 12px; line-height: 1.5; border-top-color: rgb(204, 204, 204); border-top-width: 1px; border-top-style: solid; } div.RdPageIndex ul li.FirstItem { border: currentColor; border-image: none; } div.RdPageIndex ul li a { color: rgb(0, 43, 128); text-decoration: none; } div.RdPageIndex ul li a:visited { color: rgb(96, 43, 128); text-decoration: none; } div.RdPageIndex ul li a:hover { color: rgb(177, 0, 14); text-decoration: underline; } div.RdPageIndex ul li a:active { color: rgb(177, 0, 14); text-decoration: underline; } div.RdPageIndex2 ul { padding: 5px 10px; } div.RdPageIndex2 ul li { padding: 6px 0px 6px 12px; line-height: 1.5; border-top-color: rgb(167, 249, 254); border-top-width: 2px; border-top-style: dotted; } div.RdPageIndex2 ul li.FirstItem { border: currentColor; border-image: none; } div.RdPageIndex2 ul li a { color: rgb(255, 255, 255); text-decoration: none; background-image: url("/image/jp/r1/icon/icon_link_right_l_white.gif") !important; } div.RdPageIndex2 ul li a:visited { padding: 10px 22px 10px 10px; color: rgb(255, 255, 255); text-decoration: none; } div.RdPageIndex2 ul li a:link { padding: 10px 22px 10px 10px; color: rgb(255, 255, 255); text-decoration: none; } div.RdPageIndex2 ul li a:hover { padding: 10px 24px 10px 10px; color: rgb(167, 249, 254); text-decoration: underline; } div.RdPageIndex2 ul li a:active { padding: 10px 24px 10px 10px; color: rgb(167, 249, 254); text-decoration: underline; } div#RdCaption_475 { margin: 0px; padding: 0px; width: 100%; clear: both; } ul#RdCaption_475_3 li { margin: 0px 2px; padding: 0px 0px 10px; width: 154px; text-align: center; line-height: 1.5; font-size: 83%; vertical-align: middle; float: left; display: block; list-style-type: none; } ul#RdCaption_475_3 li img { margin-bottom: 5px; } * html ul#RdCaption_475_3 { display: inline; } ul#RdCaption_475_2 li { margin: 0px 0.42%; padding: 0px 0px 10px; width: 49.05%; text-align: center; line-height: 1.5; font-size: 83%; vertical-align: middle; float: left; display: block; list-style-type: none; } ul#RdCaption_475_2 li img { margin-bottom: 5px; } * html ul#RdCaption_475_2 { display: inline; } .RdTitleLinkSet div { padding: 10px 13px 10px 15px; background-color: rgb(242, 242, 242); } .RdTitleLinkSet div h2 { margin: 0px; padding: 5px 0px 0px 7px; color: rgb(85, 112, 232); line-height: 130%; font-size: 150%; font-weight: normal; float: left; } .RdTitleLinkSet div ul { padding-top: 10px; float: right; } .RdTitleLinkSet div ul li { line-height: 130%; font-size: 76%; } .RdTitleLinkSet div ul li a { padding: 0px 17px 0px 0px; color: rgb(85, 112, 232); } .RdTitleLinkSet div ul li a:link { text-decoration: none; } .RdTitleLinkSet div ul li a:visited { text-decoration: none; } .RdTitleLinkSet div ul li a:hover { text-decoration: underline; } .RdTitleLinkSet div ul li a:active { text-decoration: underline; } .RdTheme h2 a:link { background-color: rgb(0, 0, 170); } .RdTheme h2 a:visited { background-color: rgb(0, 0, 170); } .RdTheme h2 a:hover { background-color: rgb(0, 0, 119); } .RdTheme h2 a:active { background-color: rgb(0, 0, 119); } * html .RdDateListStyle1 dd a { vertical-align: top; } * html .RdDateListStyle4 dd a { vertical-align: top; } *:first-child + html .RdDateListStyle1 dd a { vertical-align: top; } *:first-child + html .RdDateListStyle4 dd a { vertical-align: top; } .RdDateListStyle1 { margin: 0px 0px 20px; font-size: 90%; } .RdDateListStyle1 .LinkListStyle1 { margin: 0px -25px 15px -15px; font-size: 100%; } .RdDateListStyle4 .LinkListStyle2 { margin: 0px -25px 15px -15px; font-size: 100%; } .RdDateListStyle1 a { padding: 0px 10px 0px 0px; -ms-zoom: 1; } .RdDateListStyle4 a { padding: 0px 10px 0px 0px; -ms-zoom: 1; } .RdDateListStyle1 a:active { text-decoration: underline; } .RdDateListStyle1 a:hover { text-decoration: underline; } .RdDateListStyle4 a:active { text-decoration: underline; } .RdDateListStyle4 a:hover { text-decoration: underline; } .RdDateListStyle1 a:link { text-decoration: none; } .RdDateListStyle1 a:visited { text-decoration: none; } .RdDateListStyle4 a:link { text-decoration: none; } .RdDateListStyle4 a:visited { text-decoration: none; } .RdDateListStyle1 dt { line-height: 140%; } .RdDateListStyle4 dt { line-height: 140%; } .RdDateListStyle1 dt a { width: 135px; display: block; min-height: 24px; height-min: 24px; } .RdDateListStyle1 dt span { width: 135px; display: block; min-height: 24px; height-min: 24px; } .RdDateListStyle4 dt a { width: 135px; display: block; min-height: 24px; height-min: 24px; } .RdDateListStyle4 dt span { width: 135px; display: block; min-height: 24px; height-min: 24px; } .RdDateListStyle1 img { vertical-align: top; } .RdDateListStyle4 img { vertical-align: top; } .RdDateListStyle4 { margin: 0px 0px 20px; font-size: 83%; } .DateListStyle2 a .RdArchiveListImg { width: 16.76%; } .RdArchiveList { padding-left: 15px; display: inline-block; max-width: 77.84%; } * html .RdDateListStyle2 dd { margin: 0px; } *:first-child + html .RdDateListStyle2 dd { margin: 0px; } .RdDateListStyle2 dd { margin: 0px; } * html .RdDateListStyle2 dd a { vertical-align: top; } *:first-child + html .RdDateListStyle2 dd a { vertical-align: top; } * html .RdDateListStyle2 dt a { background-position: right 0.2em; } *:first-child + html .RdDateListStyle2 dt a { background-position: right 0.2em; } .RdDateListStyle2 { margin: 0px; padding-top: 0px; font-size: 90%; -ms-zoom: 1; } .RdDateListStyle2 a { padding: 0px 10px 0px 0px; -ms-zoom: 1; } .RdDateListStyle2 a:active { text-decoration: underline; } .RdDateListStyle2 a:hover { text-decoration: underline; } .RdDateListStyle2 a:link { text-decoration: none; } .RdDateListStyle2 a:visited { text-decoration: none; } .RdDateListStyle2 dd a { width: 135px; margin-right: 5px; margin-bottom: 10px; vertical-align: middle; float: left; display: inline-block; min-height: 24px; } .RdDateListStyle2 dd span { width: 135px; margin-right: 5px; margin-bottom: 10px; vertical-align: middle; float: left; display: inline-block; min-height: 24px; } .RdDateListStyle2 dd.RdText a { width: 680px; } .RdDateListStyle2 dt { width: 120px; clear: both; float: left; } .RdDateListStyle2 img { vertical-align: top; } .RdDateListStyle2::after { clear: both; display: block; content: ""; } * html .RdDateListStyle3 dd a { vertical-align: top; } * html .RdDateListStyle5 dd a { vertical-align: top; } *:first-child + html .RdDateListStyle3 dd a { vertical-align: top; } *:first-child + html .RdDateListStyle5 dd a { vertical-align: top; } .RdDateListStyle3 { margin: 0px; padding: 0px; font-size: 90%; -ms-zoom: 1; } .RdDateListStyle3 .LinkListStyle1 { margin: 0px 0px 5px; font-size: 100%; } .RdDateListStyle5 .LinkListStyle2 { margin: 0px 0px 5px; font-size: 100%; } .RdDateListStyle3 a { padding: 0px 10px 0px 0px; -ms-zoom: 1; } .RdDateListStyle5 a { padding: 0px 10px 0px 0px; -ms-zoom: 1; } .RdDateListStyle3 a:active { text-decoration: underline; } .RdDateListStyle3 a:hover { text-decoration: underline; } .RdDateListStyle5 a:active { text-decoration: underline; } .RdDateListStyle5 a:hover { text-decoration: underline; } .RdDateListStyle3 a:link { text-decoration: none; } .RdDateListStyle3 a:visited { text-decoration: none; } .RdDateListStyle5 a:link { text-decoration: none; } .RdDateListStyle5 a:visited { text-decoration: none; } .RdDateListStyle3 dd { margin: 0px 0px 0px 150px; padding: 0px; } .RdDateListStyle5 dd { margin: 0px 0px 0px 150px; padding: 0px; } .RdDateListStyle3 dt { clear: both; float: left; } .RdDateListStyle5 dt { clear: both; float: left; } .RdDateListStyle3 dt a { width: 135px; vertical-align: middle; display: inline-block; min-height: 24px; } .RdDateListStyle3 dt span { width: 135px; vertical-align: middle; display: inline-block; min-height: 24px; } .RdDateListStyle5 dt a { width: 135px; vertical-align: middle; display: inline-block; min-height: 24px; } .RdDateListStyle5 dt span { width: 135px; vertical-align: middle; display: inline-block; min-height: 24px; } .RdDateListStyle3 img { vertical-align: top; } .RdDateListStyle5 img { vertical-align: top; } .RdDateListStyle3::after { clear: both; display: block; content: ""; } .RdDateListStyle5::after { clear: both; display: block; content: ""; } .RdDateListStyle5 { margin: 0px; padding: 0px; font-size: 83%; -ms-zoom: 1; } @media screen and (max-width:767px){ .DateListStyle2 dt { padding-top: 15px; } .DateListStyle2 dd { margin: 0px 0px 15px; padding-left: 0px; border-top-color: rgb(221, 221, 221); border-bottom-color: rgb(221, 221, 221); border-top-width: 0px; border-bottom-width: 0px; border-top-style: solid; border-bottom-style: solid; } .DateListStyle2 a .RdArchiveListImg { width: 135px; padding-top: 15px; float: none; } .DateListStyle2 dd .ResponsiveLinkListStyle.BottomBorderSet { width: 100%; margin-bottom: 0px; border-top-color: currentColor; border-bottom-color: currentColor; border-top-width: medium; border-bottom-width: medium; border-top-style: none; border-bottom-style: none; } .DateListStyle2 .RdArchiveList { padding-left: 0px; max-width: 100%; } .RdDateListStyle3 { margin: 0px -15px; border-bottom-color: rgb(221, 221, 221); border-bottom-width: 1px; border-bottom-style: solid; } .RdDateListStyle3 dt { padding: 15px 0px 0px 15px; } .RdDateListStyle3 dd { padding-left: 150px; margin-left: 0px; border-top-color: rgb(221, 221, 221); border-top-width: 1px; border-top-style: solid; } .RdDateListStyle3 dd > .LinkListStyle1 { padding: 15px 0px; } .RdDateListStyle3 dd > .LinkListStyle1 li { padding: 0px 0px 0px 10px; } .JS .RdDateListStyle3 dd .ResponsiveLinkListStyle { padding-right: 0px; margin-right: 0px; border-top-color: currentColor; border-top-width: medium; border-top-style: none; } .JS .RdDateListStyle3 dd .ResponsiveListStyle { padding-right: 0px; margin-right: 0px; border-top-color: currentColor; border-top-width: medium; border-top-style: none; } .JS .RdDateListStyle3 dd .ResponsiveListStyle .LinkListStyle1 { padding: 15px 0px; } .JS .RdDateListStyle3 dd .ResponsiveListStyle .LinkListStyle1 li { padding: 0px 15px; } .JS .RdDateListStyle3 dd .ResponsiveLinkListStyle .LinkListStyle1 a { margin-left: 15px; } .JS .RdDateListStyle3 dd .ResponsiveListStyle .LinkListStyle1 a { margin-left: 15px; } .JS .RdDateListStyle3 dd .ResponsiveLinkListStyle .LinkListStyle1 span { color: rgb(0, 0, 0); margin-left: 30px; display: block; } .JS .RdDateListStyle3 dd .ResponsiveListStyle .LinkListStyle1 span { color: rgb(0, 0, 0); display: block; } .JS .ResponsiveLinkListStyle.Line2 { margin-left: 15px; } .JS .ResponsiveListStyle.Line2 { margin-left: 15px; } .JS .ResponsiveLinkListStyle.Line2 .LinkListStyle1 li { padding-left: 0px; } .JS .ResponsiveLinkListStyle.Line2 .LinkListStyle1 li a { padding-left: 0px; } .JS .ResponsiveLinkListStyle.Line2 .LinkListStyle1 li a:hover { background-color: transparent; } .JS .ResponsiveLinkListStyle.Line2 .LinkListStyle2 li a:hover { background-color: transparent; } .JS .ResponsiveLinkListStyle.Line2 .LinkListStyle1 li:hover { background-color: rgb(242, 242, 242); } .JS .ResponsiveLinkListStyle.Line2 .LinkListStyle2 li:hover { background-color: rgb(242, 242, 242); } .JS .ResponsiveLinkListStyle.Line2 .LinkListStyle1 li span { margin-left: 15px; } .JS .ResponsiveLinkListStyle.Line3 { margin-top: 0px; } .JS .ResponsiveListStyle.Line3 { margin-top: 0px; } .JS .ResponsiveLinkListStyle.Line3 .LinkListStyle1 li a:hover { background-color: transparent; } .JS .ResponsiveLinkListStyle.Line3 .LinkListStyle2 li a:hover { background-color: transparent; } .JS .ResponsiveLinkListStyle.Line3 .LinkListStyle1 li:hover { background-color: rgb(242, 242, 242); } .JS .ResponsiveLinkListStyle.Line3 .LinkListStyle2 li:hover { background-color: rgb(242, 242, 242); } .JS .ResponsiveLinkListStyle.Line4 .LinkListStyle1 li a:hover { background-color: transparent; } .JS .ResponsiveLinkListStyle.Line4 .LinkListStyle2 li a:hover { background-color: transparent; } .JS .ResponsiveLinkListStyle.Line4 .LinkListStyle1 li:hover { background-color: rgb(242, 242, 242); } .JS .ResponsiveLinkListStyle.Line4 .LinkListStyle2 li:hover { background-color: rgb(242, 242, 242); } .view2 .rdMain :first-child.contentsWidth .ButtonStyle1 { padding: 25px 0px 0px; left: inherit !important; top: inherit !important; text-align: center !important; bottom: inherit !important; margin-left: 0px !important; position: relative !important; } .Grid3 h2.midashi { margin: 0px auto; } .Grid4 h2.midashi { margin: 0px auto; } .kaihatsu_story { height: 26vw; } .main_img_box_inner h1 { line-height: 27vw !important; font-size: 19px !important; } .rd_linkbtn_box { padding-top: 60px !important; margin-top: 0px !important; margin-bottom: 19px; } div.RdStoryTab img { width: 120px !important; margin-right: 0px !important; float: left; } .JS .PageTitleStyle1.title_center { padding-top: 20px; } .JS .PageTitleStyle1.title_center h1 { font-size: 180%; } .Section.font_normal p { margin: 0px auto; width: 90%; text-align: left; } } @media screen and (max-width:579px){ .DateListStyle2 dt { border-top-color: rgb(221, 221, 221); border-top-width: 1px; border-top-style: solid; } .DateListStyle2 dd { padding-left: 0px; border-top-color: currentColor; border-bottom-color: currentColor; border-top-width: medium; border-bottom-width: medium; border-top-style: none; border-bottom-style: none; } .DateListStyle2 dd a .RdArchiveListImg { padding: 10px 0px 0px; margin-left: 0px; } .DateListStyle2 dd .ResponsiveLinkListStyle { margin: 0px; } .RdDateListStyle3 dt { border-top-color: rgb(221, 221, 221); border-top-width: 1px; border-top-style: solid; float: none; } .RdDateListStyle3 dd { padding-left: 0px; border-top-color: currentColor; border-top-width: medium; border-top-style: none; } .areaColumn .portal_top_box .Column1andthird { margin: 0px auto 20px !important; width: 90% !important; } .JS .RdDateListStyle3 dd .ResponsiveListStyle .LinkListStyle1 li { padding-left: 0px; } .JS .RdDateListStyle3 dd .ResponsiveLinkListStyle .LinkListStyle1 li a { margin-left: 0px; } .JS .ResponsiveLinkListStyle.Line2 { margin-left: 0px; } .JS .ResponsiveListStyle.Line2 { margin-left: 0px; } .JS .RdDateListStyle3 dd .ResponsiveLinkListStyle.Line2 .LinkListStyle1 li { padding-left: 15px; } .JS .RdDateListStyle3 dd .ResponsiveListStyle.Line2 .LinkListStyle1 li { padding-left: 15px; } .JS .RdDateListStyle3 dd .ResponsiveLinkListStyle.Line2 .LinkListStyle1 li span { margin-left: 0px; } } @media screen and (max-width:399px){ .RdDateListStyle3 dt { float: none; } .RdDateListStyle5 dt { float: none; } .RdDateListStyle3 dd { margin: 0px 0px 10px; } .RdDateListStyle5 dd { margin: 0px 0px 10px; } } @media screen and (min-width:995px){ .special_PC { display: block; } .special_SP { display: none; } } @media screen and (max-width:994px){ .main_img_box { margin-top: 0px !important; position: relative !important; } .special_PC { display: none; } .special_SP { display: block; } .rd_linkbtn_box { padding-top: 60px !important; margin-bottom: 30px !important; } #viewer { margin-bottom: 30px !important; } .JS #Contents .main_img_box_inner { margin: 0px -15px; padding: 0px 15px; width: 100%; height: auto; text-align: center; position: relative; min-height: inherit; min-width: inherit; } .JS .Grid3.noneside { width: 100%; } .main_img_box_inner { margin: 0px auto; width: 100%; text-align: center; position: relative; min-height: inherit !important; min-width: inherit !important; } .kaihatsu_story { background-size: auto 100% !important; } .JS .ColumnSet.portalColumn_full { margin: 0px 0px 10px !important; width: auto; padding-top: 30px; } } /*solution適用 追加アイコン*/ .Square{ display: block; padding: 0 0 0 13px; background: url("../../hst_images/jp/r1/icon/icon_bg_square.gif") no-repeat center left; } /*recruit適用 　画像リンク_赤バナー*/ .RecruitMenu{ position: relative; } @media screen and (max-width: 399px){ .RecruitMenu{ position: relative; } } .RecruitMenu a{ display: block; text-decoration: none; } .RecruitMenu a span { background-image: url("/image/jp/r1/icon/icon_link_right_l_white_hd.gif"); background-position: right center; background-repeat: no-repeat; background-size: 16px 16px; bottom: 0; box-sizing: border-box; color: #fff; left: 0; line-height: 130%; opacity: 0.9; padding: 10px 15px; position: absolute; width: 100%; } @media screen and (max-width: 994px){ .RecruitMenu a span{ font-size: 90%; } } @media screen and (max-width: 399px) { .RecruitMenu a span{ background-image: none; top: 5px; color: #707070; font-weight: bold; padding: 15px 15px 15px 135px; } .RecruitMenu a span:after{ background-image: url("/image/jp/r1/icon/icon_link_right_l_hd.gif"); background-repeat: no-repeat; background-size: 16px 16px; content: ""; display: inline-block; height:16px; margin: 0 10px; position: absolute; right: -10px; top: 17px; width:16px; } } .RecruitMenu a img{ width: 100%; height: auto; } /*recruit適用 399px時*/ @media screen and (max-width: 399px) { .JS .RecruitStyle .RecruitMenu a img{ width: 120px; height: auto; } } /*recruit適用 399px時*/ @media screen and (max-width: 399px) { .RecruitStyle{ margin: 0 0 15px 0; } } .RecruitMenu a:link span ,.RecruitMenu a:visited span{ background-color: #e60027; } @media screen and (max-width: 399px) { .RecruitMenu a:link span ,.RecruitMenu a:visited span{ background-color: transparent; } } .RecruitMenu a:hover span { background-color: #b1000e; border-right: solid 1px transparent; text-decoration: underline; } @media screen and (max-width: 399px) { .RecruitMenu a:hover span{ background-color: transparent; } } /*recruit適用　見出し（h2）背景なし*/ h2.RecruitStaff{ background-image: none; } /*recruit適用 767px時 フロート継続*/ @media screen and (max-width: 767px) { h2.RecruitStaff{ margin: 0 0 5px; } .Grid3 .ColumnSet .Recruit{ width: 50%; float: left; } } /*recruit適用 399px時 フロート解除*/ @media screen and (max-width: 399px) { .Grid3 .ColumnSet .Recruit{ width: auto; float: none; } } /*recruit適用 ブランディング画像を重ねる指定*/ .RecruitBranding{ position: relative; } .RecruitImg{ z-index: 1; } .RecruitTextImg{ position: absolute; top: 0; left: 0; z-index: 2; } .RecruitMessage{ display: none; } /*recruit適用 767px時 テキスト画像なし+画像下にテキスト表示*/ @media screen and (max-width: 579px) { .RecruitTextImg{ display: none; } .RecruitMessage{ background-color: #363434; color: #fff; display: block; padding: 8px 15px; } } /*recruit適用 dt、ddリスト文字位置調整*/ .RecruitListStyle1, .RecruitListStyle2 {margin: 0 0 20px;} .RecruitListStyle1, .RecruitListStyle2 {font-size: 90%;} .RecruitListStyle1:after, .RecruitListStyle2:after { display: block; clear: both; } .RecruitListStyle1 dt, .RecruitListStyle2 dt { clear: both; float: left; line-height: 140%; } .RecruitListStyle1 dt:after, .RecruitListStyle2 dt:after { content: " ：" } .RecruitListStyle1 dd {margin: 0 0 0 5em;} .RecruitListStyle2 dd {margin: 0 0 0 3em;} /*recruit適用 テキストスタイルマージン調整*/ .RecruitTextSyle1 { margin-bottom: 5px; } /*recruit適用 一番最初のColumn マージン調整*/ .JS .Grid3 .ColumnSetAdd .Column1{ margin-bottom: 15px; } @media screen and (max-width: 399px){ .JS .Grid3 .ColumnSetAdd .Column1{ margin-bottom: 0; } } /*************************************** ソリューション、サービス ****************************************/ .topBlockMv{ background-color: #fff; padding-top: 20px; } @media screen and (max-width: 767px) { .JS .topBlockMv{ padding-top: 15px; } } /*　header 画像　pc　*/ .topBlockMv .inner{ background-color: #03091f; background-position: right center; -webkit-background-size: auto 100%; background-size: auto 100%; background-repeat: no-repeat; color: #fff; margin-bottom: 74px; } .topEmbedded .inner{ background-image: url(../../hst_images/jp/r1/embedded/bg_mv.jpg); padding: 115px 0; } .topIot .inner{ background-image: url(../../hst_images/jp/r1/iot/bg_mv.jpg); padding: 115px 0; } .topRobot .inner{ background-image: url(../../iot/solution/image/bg_mv_robot.png); padding: 50px 0; } .topManufacture .inner{ background-image: url("../../iot/solution/manufacture/img/bg_mv_manufacture.png"); padding: 50px 0; } .topVoice .inner{ background-image: url("../../iot/solution/voice/img/bg_mv_voice.png"); padding: 50px 0; } .topDeeplearning .inner{ background-image: url("../../iot/solution/deep-learning/image/bg_mv_deeplearning.png"); padding: 50px 0; } .topFpga .inner{ background-image: url("../../embedded/solution/fpga/image/bg_mv_fpga.png"); padding: 50px 0; } .topAutomotive .inner{ background-image: url("../../embedded/solution/automotive/image/bg_mv_automotive.png"); padding: 50px 0; } .topFsafety .inner{ background-image: url("../../embedded/solution/fsafety/image/bg_mv_fsafety.png"); padding: 50px 0; } .topHard .inner{ background-image: url("../../embedded/solution/hard/image/bg_mv_hard.png"); padding: 50px 0; } @media screen and (max-width: 979px) { .JS .topBlockMv .inner{ padding-right: 20px; padding-left: 20px; } } @media screen and (max-width: 767px) { .JS .topBlockMv .inner{ background-color: transparent; background-image: none; padding: 0; margin-bottom: 30px; } } .topBlockMv .catch{ margin-bottom: 20px; font-weight: bold; font-size: 175%; } /*　header 画像　sp　*/ @media screen and (max-width: 767px) { .JS .topBlockMv .catch{ background-color: #000; background-position: right center; -webkit-background-size: auto 100%; background-size: auto 100%; background-repeat: no-repeat; padding: 50px 20px; margin-bottom: 10px; font-size:112%; } .JS .topEmbedded .catch{ background-image: url(../../hst_images/jp/r1/embedded/bg_mv_sp.jpg); } .JS .topIot .catch{ background-image: url(../../hst_images/jp/r1/iot/bg_mv_sp.jpg); } .JS .topRobot .catch{ background-image: url(../../iot/solution/image/bg_mv_robot_sp.png); } .JS .topManufacture .catch{ background-image: url("../../iot/solution/manufacture/img/bg_mv_manufacture_sp.png"); } .JS .topVoice .catch{ background-image: url("../../iot/solution/voice/img/bg_mv_voice_sp.png"); } .JS .topDeeplearning .catch{ background-image: url("../../iot/solution/deep-learning/image/bg_mv_deeplearning_sp.png"); } .JS .topFpga .catch{ background-image: url("../../embedded/solution/fpga/image/bg_mv_fpga_sp.png"); } .JS .topAutomotive .catch{ background-image: url("../../embedded/solution/automotive/image/bg_mv_automotive_sp.png"); } .JS .topFsafety .catch{ background-image: url("../../embedded/solution/fsafety/image/bg_mv_fsafety_sp.png"); } .JS .topHard .catch{ background-image: url("../../embedded/solution/hard/image/bg_mv_hard_sp.png"); } } .topBlockMv .txt{ line-height: 2.1; } @media screen and (max-width: 767px) { .JS .topBlockMv .txt{ font-size: 90%; color:#333; } .JS .topBlockMv .txt br.pc{ display: none; } } .topBlockLead{ margin-bottom: 30px; text-align: center; } .subSolution{ text-align: left; } .topBlockLead .title{ background-image: none; padding: 0 15px; font-size: 150%; margin-bottom: 25px; font-weight: bold; } @media screen and (max-width: 767px) { .JS .topBlockLead .title{ margin-bottom: 5px; } } .topBlockLead .txt{ font-size: 90%; line-height: 1.8; } @media screen and (max-width: 767px) { .JS .topBlockLead .txt br{ display: none; } } .topBlockLead .image{ margin-top: 30px; } .subSolution .image{ width: 675px; margin: 30px auto; } @media screen and (max-width: 767px) { .subSolution .image{ width: 100%; } } .subSolution img{ width: 100%; } .topBlockMenu{ margin-bottom: 50px; } .topBlockMenu + .topBlockMenu{ margin-top: 56px; } @media screen and (max-width: 767px) { .JS .topBlockMenu{ margin-bottom: 30px; } .JS .topBlockMenu + .topBlockMenu{ margin-top: 30px; } } .topTitle{ position: relative; } .topTitle .title, h2.topTitle{ border-bottom: solid 4px #dc0c35; background-image: none; padding: 0 0 6px; margin: 0 0 20px; font-size: 150%; font-weight: bold; } @media screen and (max-width: 767px) { .JS .topTitle .title, .JS h2.topTitle{ border-bottom-width: 2px; margin-bottom: 15px; font-size: 90%; } } .topTitle .link { position: absolute; top:0.3em; right: 0; text-align: right; } @media screen and (max-width: 767px) { .JS .topTitle .link{ position: static; margin-top: -10px; } } .topTitle .link a{ background-image: url(../../../image/jp/r1/icon/icon_link_right_xl_hd.gif); background-position: right center; background-repeat: no-repeat; -webkit-background-size: 12px auto; background-size: 12px auto; padding-right: 20px; font-size: 90%; text-decoration: none; } @media screen and (max-width: 767px) { .JS .topTitle .link a{ -webkit-background-size: 10px auto; background-size: 10px auto; font-size: 90%; } } .topTitle .link:hover{ text-decoration: underline; } .topBlockMenu h3, .topBlockLead h3 { background-image: none; margin: 0 0 20px; font-size: 120%; color: #333333; font-weight: bold; } @media screen and (max-width: 767px) { .JS .topBlockMenu h3, .JS .topBlockLead h3 { border-bottom-width: 2px; margin-bottom: 15px; font-size: 100%; } } .topBlockMenu h3 a:link, .topBlockMenu h3 a:visited, .topBlockLead h3 a:link, .topBlockLead h3 a:visited { background-image: none; color: #333333; text-decoration: none; background-image: url(../../image/jp/r1/icon/icon_link_right_xl_hd.gif); } .topBlockMenu h3 a:hover, .topBlockMenu h3 a:active .topBlockLead h3 a:link, .topBlockLead h3 a:visited{ color: #b1000e; text-decoration: underline; background-image: url(../../image/jp/r1/icon/icon_link_right_xl_hover_hd.gif); } .topListMenu01{ margin-left: -15px; } @media screen and (max-width: 767px) { .JS .topListMenu01{ margin-left: 0; } } .topListMenu01:after { content:"."; display:block; clear:both; height:0; visibility:hidden; } .topListMenu01 .box{ float: left; width: 33.33333%; padding-left: 15px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } @media screen and (max-width: 767px) { .JS .topListMenu01 .box{ float: none; width: auto; padding-left: 0; } .JS .topListMenu01 .box:not(:last-child){ margin-bottom: 8px; } } .topListMenu01 .box .inner{ border:solid 1px #cdcdcd; padding: 16px; } @media screen and (max-width: 767px) { .JS .topListMenu01 .box .inner{ padding: 10px; } } .topListMenu01 .box .image{ text-align: center; } .topListMenu01 .box .image img{ max-width: 100%; height: auto; } .topListMenu01 .box .image a{ display: block; } .topListMenu01 .box .image a:hover{ opacity: 0.8; } .topListMenu01 .box .title{ margin-top: 22px; font-weight: bold; font-size: 90%; } @media screen and (max-width: 767px) { .JS .topListMenu01 .box .title{ margin-top: 15px; } } .topListMenu01 .box .title a{ display: block; background-image: url(../../../image/jp/r1/icon/icon_link_right_xl_hd.gif); background-position: right center; background-repeat: no-repeat; -webkit-background-size: 12px auto; background-size: 12px auto; padding-right: 10px; color:#333; text-decoration: none; } @media screen and (max-width: 767px) { .JS .topListMenu01 .box .title a{ display: inline-block; padding-right: 20px; -webkit-background-size: 10px auto; background-size: 10px auto; } } .topListMenu01 .box .title a:hover{ text-decoration: underline; color:#b1000e; } .topListMenu01 .box .title a:visited{ color:#a94657; } .topListMenu01 .box .title a.new:after { content: 'NEW'; font-size: 70%; width: 28px; background-color: #E60027; color: #ffffff; margin-left: 5px; padding: 0 5px 0; vertical-align: top; text-decoration: none; } .topListMenu01 .box .title a.update:after { content: 'UPDATE'; font-size: 70%; width: 28px; background-color: #E60027; color: #ffffff; margin-left: 5px; padding: 0 5px 0; vertical-align: top; text-decoration: none; } .topListMenu01 .box .txt{ margin-top: 12px; font-size: 90%; } @media screen and (max-width: 767px) { .JS .topListMenu01 .box .txt{ } } .topListMenu02{ margin-left: -15px; } @media screen and (max-width: 767px) { .JS .topListMenu02{ margin-left: 0; } } .topListMenu02:after { content:"."; display:block; clear:both; height:0; visibility:hidden; } .topListMenu02 .box{ float: left; width: 50%; padding-left: 15px; margin-top: 15px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } @media screen and (max-width: 767px) { .JS .topListMenu02 .box{ float: none; width: auto; padding-left: 0; } } .topListMenu02 .box .inner{ padding: 16px; border:solid 1px #cdcdcd; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .topListMenu02 .box .inner .imageSet{ display: table; width:100%; table-layout: fixed; } @media screen and (max-width: 767px) { .JS .topListMenu02 .box .inner{ padding: 10px; } } .topListMenu02 .box .image, .topListMenu02 .box .detail{ display: table-cell; vertical-align: top; } .topListMenu02 .box .image{ width: 31%; padding-right: 15px; } .topListMenu02 .box .image img{ max-width: 100%; height: auto; } .topListMenu02 .box .image a{ display: block; } .topListMenu02 .box .image a:hover{ opacity: 0.8; } .topListMenu02 .box .detail .title{ margin-bottom: 10px; font-weight: bold; } .topListMenu02 .box .detail .title a{ display: inline-block; color:#333; text-decoration: none; } .topListMenu02 .box .detail .title a:hover{ text-decoration: underline; color:#b1000e; } .topListMenu02 .box .detail .title a:visited{ color:#a94657; } .topListMenu02 .box .detail .title a::after{ content:""; display: inline-block; background-image: url(../../../image/jp/r1/icon/icon_link_right_xl_hd.gif); background-position: 0 0; background-repeat: no-repeat; -webkit-background-size: 12px auto; background-size: 12px auto; width: 12px; height: 12px; margin-left: 10px; } @media screen and (max-width: 767px) { .JS .topListMenu02 .box .detail .title a::after{ -webkit-background-size: 10px auto; background-size: 10px auto; width: 10px; height: 10px; } } .topListMenu02 .box .detail li{ margin-top: 6px; font-size: 90%; } @media screen and (max-width: 767px) { .JS .topListMenu02 .box .detail li{ margin-top: 3px; } } .topListMenu02 .box .detail li a{ display: inline-block; text-decoration: none; color:#bd2426; } .topListMenu02 .box .detail li a::after{ content:""; display: inline-block; background-image: url(../../../image/jp/r1/icon/icon_link_right_xl_hd.gif); background-position: 0 0; background-repeat: no-repeat; -webkit-background-size: 10px auto; background-size: 10px auto; width: 10px; height: 10px; margin-left: 10px; position: relative; top:0.1em; } @media screen and (max-width: 767px) { .JS .topListMenu02 .box .detail li a::after{ -webkit-background-size: 8px auto; background-size: 8px auto; margin-left: 6px; width:8px; height: 8px; top:0.02em; } } .topListMenu02 .box .detail li a:hover{ text-decoration: underline; } .topBoxBanner .box .inner { padding: 15px; display: table; width: 100%; table-layout: fixed; border: solid 1px #cdcdcd; box-sizing: border-box; } .topBoxBanner .box { display: block; width: 100%; box-sizing: border-box; text-decoration: none; color: #333; } .topBoxBanner .box a { text-decoration: none; } .topBoxBanner .box a:hover { opacity: 0.8; text-decoration: underline; } .topBoxBanner .box .icon { width: 230px; text-align: center; } .topBoxBanner .box .icon, .topBoxBanner .box .detail { display: table-cell; vertical-align: middle; } .topBoxBanner .box .icon img { max-width: 100%; height: auto; } .topBoxBanner .box .detail .title { padding: 0 40px 0 0; position: relative; text-decoration: none; font-weight: bold; font-size: 90%; text-align: left; margin-bottom: 10px; } .topBoxBanner .box .detail .title::after { content: ""; position: absolute; top: 0; right: 15px; bottom: 0; margin: auto; background-image: url(../../../../image/jp/r1/icon/icon_link_right_xl_hd.gif); background-position: 0 0; background-repeat: no-repeat; -webkit-background-size: 12px auto; background-size: 12px auto; width: 12px; height: 12px; } @media screen and (max-width: 767px){ .topBoxBanner .box .inner { padding: 10px; } .topBoxBanner .box .icon { width: 100px; } .topBoxBanner .box .detail .title { padding-right: 20px; -webkit-background-size: 10px auto; background-size: 10px auto; margin-top: 15px; } .topBoxBanner .box .detail .title::after { -webkit-background-size: 10px auto; background-size: 10px auto; width: 10px; height: 10px; position: absolute; right: 5px; } } .BannerColumnSet { margin-left: -15px; } .BannerColumn2 { float: left; width: 50%; padding-left: 15px; margin-top: 15px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .BannerColumn2 img { width: 100%; } @media screen and (max-width: 767px){ .BannerColumn2 { display: block; text-align: center; width: 100%; } .BannerColumn2.FirstItem { margin-bottom: 10px; } .BannerColumn2.LastItem { margin: 0; } .NoticeBanner2 img { width: 100%; } } .topListMenu01Line { padding: 0 0 50px; } @media screen and (max-width: 767px){ .topListMenu01Line { padding: 0 0 30px; } } /* 画像上のボタン */ .imgLeadBtnWrap { position: relative; margin: 0 auto; width: 1030px; } .imgLeadBtn { background: url(../../hst_images/jp/r1/embedded/btn_lead.png) no-repeat; background-size: 100%; position: absolute; height: 136px; right: 66px; top: 110px; width: 284px; } .imgLeadBtn:hover{ background: url('../../hst_images/jp/r1/embedded/btn_lead_on.png') no-repeat; background-size: 100%; } .imgLeadBtnWrap a { display: block; width: 100%; } @media screen and (max-width: 994px){ .imgLeadBtnWrap { margin: 0; width: 100%; } .imgLeadBtn { height: 13vw; right: 6.2vw; top: 10.2vw; width: 26.2vw; } } @media screen and (max-width: 767px){ .imgLeadBtn { height: 12vw; right: 6vw; top: 10vw; width: 25.2vw; } } table.correspondingArea th, table.correspondingArea td { border-color: #939393; } .CASoftware { background: #4472c4; color: #fff; font-weight: bold; text-align: center; vertical-align: text-top; } .CAapp1 { background: #DCECDB; border-bottom: none; font-weight: bold; } .CAapp2 { background: #DCECDB; border: none; font-weight: bold; } .CAapp3 { background: #DCECDB; font-weight: bold; width: 16%; } .CAapp4 { background: #DCECDB; font-weight: bold; width: 22%; } .CAapp5 { background: #DCECDB; } .CAplatform1 { background: #dae3f3; font-weight: bold; vertical-align: text-top; border-bottom: none; } .CAplatform2 { background: #dae3f3; border: none; } .CAplatform3, .CAplatform4 { background: #dae3f3; font-weight: bold; } .CAplatform5 { background: #dae3f3; } .CAhardware { background: #9544c4; color: #fff; font-weight: bold; text-align: center; vertical-align: text-top; } .CAboard1, .CAboard2 { background: #e8d1f9; font-weight: bold; } .CAboard3 { background: #e8d1f9; } .softListStyle2 { margin: 0 !important; } /* リメイクサービス */ .ColumRemakeText { width: 70%; float: left; margin: 0; padding: 0 16px; box-sizing: border-box; } @media screen and (max-width: 767px){ .ColumRemakeText{ float: none; width: auto; margin: 0 0 0 15px; } } .ColumRemakeImg { width: 30%; float: left; } @media screen and (max-width: 767px){ .ColumRemakeImg { float: none; width: auto; text-align: center; } } .RemakeResult th, .RemakeResult td{ border-color: #5e6052; } .RemakeResult th { background: #1f4e4f; color: #fff; text-align: center; } .RemakeResult th:nth-child(1) { width: 16%; } .RemakeResult th:nth-child(2) { width: 84%; } .RemakeResult td { background: #bcdbf2; } .RemakeResult tr:last-child td { background: #dcf3f7; } .ColumRemakeImg img { width: 100%; } @media screen and (max-width: 767px){ .ColumRemakeImg img { width: 35%; } } @media screen and (max-width: 579px){ .ColumRemakeImg img { width: 60%; } } /*************************************** 新卒採用サイト 2020 ****************************************/ /*Staff*/ .Staff1{background-image: url("../../recruit/img/staff_1_bk.jpg");} .Staff2{background-image: url("../../recruit/img/staff_2_bk.jpg");} .Staff3{background-image: url("../../recruit/img/staff_3_bk.jpg");} .Staff4{background-image: url("../../recruit/img/staff_4_bk.jpg");} .Staff5{background-image: url("../../recruit/img/staff_5_bk.jpg");} .Staff6{background-image: url("../../recruit/img/staff_6_bk.jpg");} .Staff7{background-image: url("../../recruit/img/staff_7_bk.jpg");} .ProfileArea{ position: relative; } .ProfileBox{ background-repeat: no-repeat; background-size: cover; height: 350px; left: 0; position: absolute; top: 0; width: 100%; } @media screen and (max-width: 767px){ .ProfileBox{ position: static; } } @media screen and (max-width: 579px){ .ProfileBox{ background-position: 43% 50%; } .Staff6{ background-position: 0% 50%; } .Staff7{ background-position: 100% 50%; } } @media screen and (max-width: 399px){ .ProfileBox{ height: 280px; background-position: 43% 50%; } .Staff6{ background-position: 0% 50%; } .Staff7{ background-position: 100% 50%; } } .Profile{ background-color: rgba(177,51,51,0.8); top: 275px; color: #fff; padding: 15px 30px; position: absolute; right: 0; width: 50%; } @media screen and (max-width: 994px){ .Profile{ padding: 15px; } } @media screen and (max-width: 579px){ .Profile{ background-color: rgba(177,51,51,1); position: static; width: auto; } } .ProfileTitle{ font-weight: bold; margin-bottom: 20px; } .Profile dl{ font-size: 85%; } .Profile dl dt{ float: left; } .Profile dl dd{ display: inline; } .Profile dl dt:after{ content: ":"; display: inline-block; padding: 0 5px; } .MainContents{ margin-top: 480px; } @media screen and (max-width: 994px){ .MainContents{ margin-top: 500px; } } @media screen and (max-width: 767px){ .MainContents{ margin-top: 130px; } } @media screen and (max-width: 579px){ .MainContents{ margin-top: 25px; } } /*Staff2*/ .Staff2Contents{ margin-top: 535px; } @media screen and (max-width: 767px){ .Staff2Contents{ margin-top: 175px; } } @media screen and (max-width: 579px){ .Staff2Contents{ margin-top: 25px; } } /*Staff3*/ /*Staff5*/ /*Staff6*/ @media screen and (max-width: 767px){ .Staff3Contents, .Staff5Contents, .Staff6Contents{ margin-top: 150px; } } @media screen and (max-width: 579px){ .Staff3Contents, .Staff5Contents, .Staff6Contents{ margin-top: 25px; } } /*Staff4*/ @media screen and (max-width: 994px){ .Staff4Contents{ margin-top: 535px; } } @media screen and (max-width: 767px){ .Staff4Contents{ margin-top: 190px; } } @media screen and (max-width: 579px){ .Staff4Contents{ margin-top: 25px; } } .CatchCopy{ color: #B1000E; font-size: 120%; font-weight: bold; } .JS h2.MainTitleLevel1{ background: none; font-weight: bold; margin: 0 0 5px; } .JS h2.DecorationItem{ padding: 0 0 0 15px; position: relative; } .JS h2.DecorationItem:before{ background-color: #B1000E; content: ""; display: block; height: 22px; left: 0; position: absolute; top: 0; width: 8px; } .JS h2.ScheduleItem{ background-image: url(../../recruit/img/icon_schedule.png); background-repeat: no-repeat; background-position: 0px -8px; background-size: 40px; padding: 0 0 0 35px; } .JS h2.HolidayItem{ background-image: url(../../recruit/img/icon_holiday.png); background-repeat: no-repeat; background-position: -5px -9px; background-size: 40px; padding: 0 0 0 32px; } .SectionMargin{ margin-bottom: 45px; } /*Column A*/ .ColumnBoxSetA{ display: flex; justify-content: center; } @media screen and (max-width: 579px){ .ColumnBoxSetA{ flex-direction: column; } } .ColumnBoxSetA .ColumnBox1{ margin-right: 15px; width: 480px; } .ColumnBoxSetA .ColumnBox2{ width: 240px; } @media screen and (max-width: 579px){ .ColumnBoxSetA .ColumnBox1{ margin-right: 0; min-height: 0%; width: 100%; } .ColumnBoxSetA .ColumnBox2{ margin: 0 auto; min-height: 0%; width: 80%; } } /*Column B*/ .ColumnBoxSetB{ display: flex; flex-direction: row-reverse; justify-content: center; } @media screen and (max-width: 579px){ .ColumnBoxSetB{ flex-direction: column; } } .ColumnBoxSetB .ColumnBox1{ margin-left: 15px; width: 480px; } .ColumnBoxSetB .ColumnBox2{ width: 240px; } @media screen and (max-width: 579px){ .ColumnBoxSetB .ColumnBox1{ margin-left: 0; min-height: 0%; width: 100%; } .ColumnBoxSetB .ColumnBox2{ margin: 0 auto; min-height: 0%; width: 80%; } } /*Column img*/ .ColumnBoxSetA .ColumnBox1 img, .ColumnBoxSetA .ColumnBox2 img, .ColumnBoxSetB .ColumnBox1 img, .ColumnBoxSetB .ColumnBox2 img{ height: auto; width: 100%; } .ScheduleArea{ background-color: #e2e2e2; padding: 15px 0 45px 0; } @media screen and (max-width: 579px){ .ScheduleArea{ background-color: transparent; padding: 0; } } .Schedule{ margin: 0 auto; width: 90%; } /*************************************** 製品ページ ****************************************/ .PcTable { display: block; } .MobileTable { display: none; } @media screen and (max-width: 766px){ .PcTable{ display: none; } .MobileTable{ display: block; } } .TextCover { width: 0; height: 0; overflow: hidden; display: inline-block; } .SquareBox{ border: solid 1px #cdcdcd; padding: 16px; } @media screen and (max-width: 766px){ .ImgRWD{ text-align: center; } } /*************************************** ニュースリリース ****************************************/ .NoticeDataBox .DateListStyle2 dd.NoticeAdjust { margin: 0 0 0 9em; } @media screen and (max-width: 579px){ .NoticeDataBox .DateListStyle2 dd.NoticeAdjust { margin: 0; } } .Indent_add:before{ content:"　"; } .TextNarrow{ margin: 0; font-size: 90%; } .Nrlelinebreak{ display: block; } @media screen and (max-width: 579px){ .Nrlelinebreak{ display: inline; } } .SPlinebreak{ display: inline; } @media screen and (max-width: 579px){ .SPlinebreak{ display: block; } } /*************************************** イベント情報ページ ****************************************/ .EventRelease .DateListStyle1 { margin: 0; padding: 15px 0 15px 15px !important; border-bottom: solid 1px #ddd; overflow: hidden; } .EventRelease dl, .EventRelease dt, .EventRelease dd{ background-color: none; } .EventRelease dl:hover { background-color: #FDF7F7; } .EventRelease a { color: #333; text-decoration: none; background-color: #ffffff; } .EventRelease .ThumbW230SetStyle .DateListStyle1 { border-bottom: none; } .EventRelease .ThumbW230SetStyle .Img { padding: 0 0 0 15px; } @media screen and (max-width: 767px){ .JS .EventRelease .ResponsiveLinkListStyle .ThumbW230SetStyle .Img { padding: 15px 0 0 15px; } } .EventRelease .ThumbW230SetStyle img { box-sizing: border-box; border: 1px solid #ddd; } .EventRelease .ThumbW230SetStyle { margin-bottom: 0; padding: 15px 0 !important; border-bottom: solid 1px #ddd; overflow: hidden; } .EventRelease div.ThumbW230SetStyle:hover { background-color: #FDF7F7; } .EventRelease .Scheddule, .EventRelease .Done { margin-bottom: 30px; } /*************************************** 環境ページ ****************************************/ .TextSize120 { font-size: 120%; } /*順序付きリスト丸括弧*/ ol.ListStyleRB>li{ list-style-type:none; list-style-position:inside; counter-increment: cnt; } ol.ListStyleRB>li:before{ display: marker; content: "（" counter(cnt) "）"; } ol.ListStyle1 ol.ListStyleRB { padding-left: 0; } ol.ListStyleRB { margin: 0 0 20px; } ol.ListStyleRB {font-size: 90%;} ol.ListStyleRB li{ margin: 0 0 5px; line-height: 140%; } ol.ListStyleRB ul li{ margin: 5px 0 0; padding-left: 2.6em; list-style-type: none; font-size: 100%; } /*************************************** 駅コンシェルお試しキャンペーン 2019/10/16_2020/03/31 ****************************************/ .LayerPosition { width: 100%; position: relative; } .LayerTop { z-index: 100; position: relative; } @media screen and (max-width: 994px){ .LayerTop { padding-left: 10px; padding-right: 10px; } } .BgcGrdBl { background-image: radial-gradient(farthest-corner at 100px -120px,#2F7FBB 0,#004B96 100%); background-size: cover; pointer-events: none; position: absolute; width: 100%; height: 100%; z-index: 0; } .BgcLGry { background-size: cover; pointer-events: none; position: absolute; width: 40%; height: 100%; z-index: 1; background-color: #e5e5e5; } .BgcWhite{ background: #ffffff; background-size: cover; pointer-events: none; position: absolute; width: 100%; height: 100%; z-index: 1; } .BrandingBottomImg { margin: 0; padding: 0; width: 100%; position: absolute; z-index: 2; user-select: none; } .BrandingBottomImg img { margin: 0; padding: 0; width: 100%; user-select: none; } h2.TxtNavy { background: none; color: #004B96; display: block; padding: 10px 15px; font-size: 140%; font-weight: bold; line-height: 130%; } .TxtNavy{ color: #004B96; font-weight: bold; } h2.TxtWhite{ background: none; color: #ffffff; display: block; padding: 10px 15px; font-size: 140%; font-weight: bold; line-height: 130%; } .TxtWhite { color:#ffffff; } .TxtBold { font-weight: bold; } h1.TxtSize200 { font-size: 200%; } @media screen and (max-width: 767px){ .JS .PageTitleStyle1 h1.TxtSize200, .JS .PageTitleStyle2 h1.TxtSize200 { font-size: 200%; } } .TxtSize200 { font-size: 200%; } .TxtSize160 { font-size: 160%; } p.TxtH200{ line-height: 200%; margin-bottom: 30px; } .mTop40 { margin-top: 40px; } .mTop20 { margin-top: 20px; } .mBottom30 { margin-bottom: 30px; } .mBottom60 { margin-bottom: 60px; } .RTrialAdjust{ padding: 20px 0 30px; } .BoxPatternSdw { clear: both; margin: 0 0 15px; padding: 20px 0; width: 100%; box-shadow: 0 8px 15px 0 rgba(0,0,0,.2); background: #fff; box-sizing: border-box; } .BoxPatternSdw:after { content: ""; display: block; clear: both; } .BoxPatternSdw .BoxImgStyle { margin: -15px 0 0; padding: 0 0 15px; } .BoxPatternSdw .ImgOnlyStyle { margin-bottom: 10px; } .BoxPatternSdw p, .BoxPatternSdw ul, .BoxPatternSdw dl { margin-bottom: 10px; padding-left: 15px; padding-right: 15px; } .DetailListBox dl { margin-bottom: 10px; display: table; font-size: 90%; } @media screen and (max-width: 767px){ .DetailListBox dl { margin-bottom: 10px; display: block; } } .DetailListBox dt{ display: table-cell; width: 7rem; font-weight: bold; } @media screen and (max-width: 767px){ .DetailListBox dt { display: block; width: 100%; } } .DetailListBox dd{ display: table-cell; } @media screen and (max-width: 767px){ .DetailListBox dd { display: block; width: 100%; } } .ButtonStyleWhite a { margin: 0 auto; min-width: 200px; border: 2px solid #ffffff; color: #ffffff; font-weight: bold; display: inline-block; text-decoration: none; } .ButtonStyleWhite a:link { text-decoration: none; color: #ffffff; } .ButtonStyleWhite a:hover { background-color: #004d99; } .ButtonStyleWhite a span{ display: inline-block; padding: 8px 25px 8px 15px; position: relative; } .ButtonStyleWhite a span:after{ border-top: 2px solid #fff; border-right: 2px solid #fff; bottom: 0; content: ""; height: 7px; margin: auto; position: absolute; right: 15px; top: -1px; -webkit-transform: rotate(45deg); transform: rotate(45deg); width: 7px; } .ButtonStyleWhite a:hover span:after{ right: 10px; } /*************************************** コラムページ ****************************************/ p.ColumnsDate { font-size: 90%; margin: 0 0 5px; } ul.ColumnsTags { display: flex; flex-direction: row; flex-wrap: wrap; } .ColumnsTags li{ margin: 0 5px 5px 0; padding: 0 5px; border: solid 1px #cdcdcd; font-size: 83%; } .ColumnsInnerLinks { margin-bottom:15px; } .ColumnsInnerLinks li { float: left; width: 240px; } @media screen and (max-width: 767px){ .JS .ColumnsInnerLinks li { width: 100%; } } .ColumnsInnerLinks li:first-child a { border-left: 0; } .ColumnsInnerLinks li a { position: relative; display: block; height: 130px; padding: 70px 0 0 0; color: #ffffff; font-size: 100%; font-weight: bold; text-decoration: none; text-align: center; border: 1px solid #888888; box-sizing: border-box; background-color: #555555; background-repeat: no-repeat; background-position: center 20px; background-size: 40px; } .ColumnsInnerLinks li a:hover { background-color: #92000F; } .ColumnsInnerLinks li a:hover:after { bottom: 13px; } .ColumnsInnerLinks li:first-child a { border-left: 0; } .ColumnsLinkBox { width: 100%; padding: 16px; border: solid 1px #cdcdcd; box-sizing: border-box; } .ColumnsLinkBox .imageSet { overflow: hidden; } .ColumnsLinkBox .image { margin: 0 20px 0 0; width: 120px; float: left; } .ColumnsLinkBox .image a:hover { opacity: 0.8; } .ColumnsLinkBox .image img { width: 100%; } .ColumnsLinkBox .title a { margin-bottom: 10px; padding-right: 10px; display: block; background-image: url("../../../image/jp/r1/icon/icon_link_right_xl_hd.gif"); background-position: right center; background-repeat: no-repeat; -webkit-background-size: 12px auto; background-size: 12px auto; text-decoration: none; color: #a94657; font-weight: bold; font-size: 100%; } .ColumnsLinkBox .title a:hover{ text-decoration: underline; color:#b1000e; } .ColumnsLinkBox .title a:visited{ color:#a94657; } /*************************************** 共通 ****************************************/ /*文字設定*/ h5{ font-size: 83%; margin: 0 0 10px; } .SubCatchCopy{ margin: -20px 0 15px; } .TextSize09R{ font-size: 0.9rem; } .headingSq { padding: 0.125rem 0 0 0.625rem; line-height: 1.4; background: none; border-left: 5px solid #dc0c35; } @media screen and (min-width: 768px){ h2.RightP20 { text-align: right; padding-right: 20px; } } h3.headingSqUl { padding: 0.5rem 0 0.5rem 0.625rem; line-height: 1.4; background: none; border-left: 5px solid #dc0c35; border-bottom: #ededed solid 1px; } /*改行調整*/ .AdjustBreak{ display: block; } @media screen and (max-width: 579px){ .AdjustBreak{ display: inline; } } .SPTableWordBreak { word-break: break-all; } .SPTitleWordBreak { word-break: break-all; } .WordBreak { word-break: break-all; -moz-word-break:break-all; -webkit-word-break:break-all; -o-word-break:break-all; -ms-word-break:break-all; } /*余白設定*/ .mBottom15 { margin-bottom: 15px; } .mBottom20 { margin-bottom: 20px; } .pBottom15 { padding-bottom: 15px; } .pBottom5 { padding-bottom: 5px; } /*インデント*/ .IndenStyle1 { box-sizing: border-box; padding: 0 16px; } /*枠囲み*/ .BoxPatternD { clear: both; margin: 0 0 15px; padding: 15px 0 5px 0; background-color: transparent; border: 1px solid #cdcdcd; } .BoxPatternD .Title, .BoxPatternD h2, .BoxPatternD h3, .BoxPatternD h4 { margin: 0; padding: 0 15px 10px; font-size: 90%; font-weight: bold; color: #575757; border: none; } .BoxPatternD h2 { background-image: none; } .BoxPatternD p, .BoxPatternD ul, .BoxPatternD dl { margin-bottom: 10px; padding-left: 15px; padding-right: 15px; } .BoxPatternD:after { content: ""; display: block; clear: both; } .bBottomDot { border-bottom: 1px dotted #cdcdcd; } audio.AudioW100{ display: block; width: 100%; margin: 0 auto 10px; padding-left: 15px; padding-right: 15px; box-sizing: border-box; height: 45px; } .bRed{ border: 2px solid #e60027; } /*HorizontalInnerLinks サイズ*/ .HorizontalInnerListHarf li{ width: 50%; margin: 0; } .HorizontalInnerListThree li{ width: 33%; margin: 0; } .HorizontalInnerLinksInterval li{ margin: 0 80px 0 0; } .HorizontalInnerLinks li.LongBottom{ width: 100%; margin: 0; } @media screen and (max-width: 767px) { .HorizontalInnerListHarf li, .HorizontalInnerListThree li{ width: 100%; } } /*************************************** ニュースリリース top ****************************************/ .SortNavi { position: relative; clear: both; padding: 0 0 20px; overflow: hidden; } .SortNavi ul { margin: 0; } .SortNavi li { float: left; position: relative; background-color: #EEE; } .SortNavi li:nth-of-type(-n+3) { background: url(/image/jp/r1/bg_category_navi.gif) no-repeat right center #EEE; } .SortNavi li:hover { background-color: #DDD; } .SortNavi li a { position: relative; float: left; display: block; min-width: 40px; font-size: 83%; text-align: center; color: #333; } .SortNavi li a:link, .SortNavi li a:visited { text-decoration: none; } .SortNavi li a strong { color: #333; } .SortCategory { cursor: pointer; padding: 10px 20px; } .SortCategory a::before { content: ""; display: inline-block; margin: 0 10px 0 0; background: url(/corporate/news/image/news_icon_all.png) no-repeat; background-size: contain; -moz-background-size: contain; -webkit-background-size: contain; -o-background-size: contain; -ms-background-size: contain; vertical-align: middle; width: 24px; height: 24px; } .SortCategory:nth-child(2) a::before { background-image: url(/corporate/news/image/news_icon_02.png); } .SortCategory:nth-child(3) a::before { background-image: url(/corporate/news/image/news_icon_01.png); } .SortCategory:nth-child(4) a::before { background-image: url(/corporate/news/image/news_icon_03.png); } .IsActive { background-color: #B1000E !important; } .IsActive::after { content: ""; position: absolute; bottom: -22px; right: calc(50% - 12px); border: solid 12px transparent; border-top: solid 12px #B1000E; } .IsActive[data-group='a']::after { border-top: solid 12px #CC3B1E; } .IsActive[data-group='b']::after { border-top: solid 12px #325AB3; } .IsActive[data-group='c']::after { border-top: solid 12px #3D853F; } .IsActive a, .IsActive a strong { color: #FFF !important; } .IsActive[data-group='b']:nth-child(2) { background-color: #325AB3 !important; } .IsActive[data-group='b']:nth-child(2) a::before { background-image: url(/corporate/news/image/news_icon_02_current.png); } .IsActive[data-group='a']:nth-child(3) { background-color: #CC3B1E !important; } .IsActive[data-group='a']:nth-child(3) a::before { background-image: url(/corporate/news/image/news_icon_01_current.png); } .IsActive[data-group='c']:nth-child(4) { background-color: #3D853F !important; } .IsActive[data-group='c']:nth-child(4) a::before { background-image: url(/corporate/news/image/news_icon_03_current.png); } .IsHide { display: none; } .ListItem dt { padding: 6px 0 0 0; } .ListItem .LinkListStyle1 { margin: -5px 0 10px; } .ListItem .LinkListStyle1 li { padding-left: 40px; text-indent: -33px; } .ListItem .LinkListStyle1 li::before { display: inline-block; text-decoration: none; content: ""; margin: 0 10px 0 0; vertical-align: middle; width: 24px; height: 24px; } .ListItem .LinkListStyle1[data-group='a'] li::before { background: url(/corporate/news/image/news_icon_01.png) no-repeat; background-size: contain; -moz-background-size: contain; -webkit-background-size: contain; -o-background-size: contain; -ms-background-size: contain; } .ListItem .LinkListStyle1[data-group='b'] li::before { background: url(/corporate/news/image/news_icon_02.png) no-repeat; background-size: contain; -moz-background-size: contain; -webkit-background-size: contain; -o-background-size: contain; -ms-background-size: contain; } .ListItem .LinkListStyle1[data-group='c'] li::before { background: url(/corporate/news/image/news_icon_03.png) no-repeat; background-size: contain; -moz-background-size: contain; -webkit-background-size: contain; -o-background-size: contain; -ms-background-size: contain; } @media screen and (max-width: 767px) { .SortNavi ul { background-image: none; } .SortNavi li { float: none; } .SortNavi li:hover { opacity: 1; } .SortNavi li:nth-of-type(-n+3) { background: none #EEE; } .SortNavi li a { float: none; min-width: none; height: auto; padding: 11px 25px 11px 15px; text-align: left; line-height: 140%; font-size: 80%; } .SortNavi li:nth-of-type(n+2) a { border-top: solid 1px #CCC; } .SortCategory { padding: 0; } .IsActive::after { display: none; } .ListItem .LinkListStyle1 li { padding-left: 0; text-indent: 0; } .ListItem .LinkListStyle1 li a:hover, .ListItem .LinkListStyle1 li a:visited { background-color: transparent !important; } } /*************************************** トップページ特設　お知らせ掲載 ****************************************/ .ImportantInfoSet{ box-sizing: border-box; margin: 0 auto 30px; width: 965px; } @media screen and (max-width: 994px){ .ImportantInfoSet{ padding: 0 15px; width: 100%; } } .InfoBox{ background: #fff; box-sizing: border-box; padding: 22px 20px 18px; } .InfoText{ font-size: 90%; margin: auto 6rem .5rem 6rem; } @media screen and (max-width: 767px){ .InfoText{ margin: auto 0 .5rem 0; } } a.InfoLink{ display: block; font-size: 90%; text-align: center; text-decoration: none; } a.InfoLink:hover{ text-decoration: underline; } a.InfoLink::before{ content: ""; display: inline-block; width: 22px; height: 22px; margin-right: 7px; vertical-align: -.4em; background: url("/image/jp/r1/icon/icon_info.png") 0 0 no-repeat; background-size: cover; } /*************************************** Column コラム一覧 ****************************************/ .FullGridSet{ box-sizing: border-box; margin: 0 auto; width: 100%; } @media screen and (max-width: 994px){ .FullGridSet{ margin: 0 -15px; padding: 0 15px; width: auto; } } .ColumnBgStyle{ background-color: #f2f2f2; } .ColumnArea{ box-sizing: border-box; padding: 65px 0 40px; text-align: center; } @media screen and (max-width: 579px){ .ColumnArea{ padding: 40px 0 20px; } } .ColumnArea h1{ color: #dc0c35; font-size: 280%; line-height: 1.2; margin-bottom: 20px; } @media screen and (max-width: 579px){ .ColumnArea h1{ font-size: 240%; } } .ColumnArea h1 span.Title{ text-transform: uppercase; } .ColumnArea h1 span.SubTitle{ color: #333; display: block; font-size: 40%; font-weight: bold; } .ColumnStyle{ margin-bottom: 30px; } .ColumnStyle .Outer{ background: #fff; text-decoration: none; } .ColumnStyleImg img{ height: auto; width: 100%; } .ColumnStyle .Outer h3{ margin-top: 22px; font-weight: bold; font-size: 100%; padding-right: 10px; color: #333; } .ColumnStyle .Outer p.ColumnTxt{ color: #333; font-size: 90%; } .ColumnStyle .Outer p.ColumnData{ color: #333; font-size: 87%; margin: 0 0 5px; } .ColumnStyle .Outer p.ColumnData img{ vertical-align: middle; } .TopBannerSet{ display: flex; align-items: center; justify-content: space-between; margin-bottom: 60px; } @media screen and (max-width: 767px){ .TopBannerSet{ flex-direction: column; margin-bottom: 20px; } } /* カラム5:5 */ .TopBannerSet .Banner{ width: 475px; } @media screen and (max-width: 994px){ .TopBannerSet .Banner{ width: 49%; } } @media screen and (max-width: 767px){ .TopBannerSet .Banner{ margin-bottom: 15px; width: 80%; } } @media screen and (max-width: 579px){ .TopBannerSet .Banner{ width: 100%; } } .TopBannerSet .Banner a{ display: block; } .TopBannerSet .Banner a img{ height: auto; width: 100%; } .TopBannerSet .Banner a:hover{ opacity: 0.8; } /* カラム3.5:6.5 */ .TopBannerSet .BannerStyle1{ width: 332px; } .TopBannerSet .BannerStyle2{ width: 617px; } @media screen and (max-width: 994px){ .TopBannerSet .BannerStyle1{ width: 39%; } .TopBannerSet .BannerStyle2{ width: 59%; } } @media screen and (max-width: 767px){ .TopBannerSet .BannerStyle1, .TopBannerSet .BannerStyle2{ width: 100%; } } /* Bannerimage pc/sp切り替え */ .TopBannerSet .Banner .pc{ display: block; } @media screen and (max-width: 767px){ .TopBannerSet .Banner .pc{ display: none; } } @media screen and (max-width: 579px){ .TopBannerSet .Banner .pc{ display: block; } } .TopBannerSet .Banner .sp{ display: none; } @media screen and (max-width: 767px){ .TopBannerSet .Banner .sp{ display: block; } } @media screen and (max-width: 579px){ .TopBannerSet .Banner .sp{ display: none; } } .TopBannerSet .LinkListStyle1{ margin: 0; } /* カラム img */ .ImgColumn img{ width: 100%; height: auto; } @media screen and (min-width: 995px){ .YouTubeBox .Inner h2.TextSize100, .YouTubeBox .Inner h3.TextSize100, .YouTubeBox .Inner h4.TextSize100 { font-size: 100%; } } /*************************************** 画像認識エッジソリューション ****************************************/ /* 画像内リンク */ .image-innerlink{ position: relative; margin-right: auto; margin-bottom: 30px; margin-left: auto; max-width: 675px; } .image-innerlink img{ max-width: 100%; } @media screen and (max-width: 767px) { .JS .image-innerlink{ max-width: 100%; } } .image-innerlink .link{ position: absolute; width: 35.5%; height: 48%; border-radius: 50%; text-decoration: none; text-indent: -9999px; } @media screen and (max-width: 767px) { .JS .image-innerlink .link{ position: absolute; width: 36%; height: 48%; } } .image-innerlink .link::after{ content: ""; position: absolute; top:0; right: 0; left:0; bottom: 0; background-color: #000; border-radius: 50%; opacity: 0; } .image-innerlink .link:hover::after{ opacity: 0.2; } .link_dl_approach{ top: 0; left: 0; } .link_dl_prevention{ top: 26%; left: 32.3%; } .link_dl_safety{ top: 0; left: 64.5%; } .link_dl_crossroad{ top: 52%; left: 0; } .link_dl_parking{ top: 52%; left: 64.5%; } /*************************************** ニューノーマルを支えるソリューション ****************************************/ /* 画像内リンク */ .image-innerlink100{ position: relative; margin-right: auto; margin-bottom: 30px; margin-left: auto; max-width: 100%; } .image-innerlink100 img{ max-width: 100%; } @media screen and (max-width: 767px) { .JS .image-innerlink100{ max-width: 100%; } } .image-innerlink100 .link_nn{ position: absolute; border-radius: 50%; text-decoration: none; text-indent: -9999px; } @media screen and (max-width: 767px) { .JS .image-innerlink100 .link_nn{ position: absolute; } } .image-innerlink100 .link_nn::after{ content: ""; position: absolute; top:0; right: 0; left:0; bottom: 0; background-color: #000; border-radius: 50%; opacity: 0; } .image-innerlink100 .link_nn:hover::after{ opacity: 0.2; } .link_nn_city{ top: 62.8%; left: 51.1%; width: 14.5%; height: 30.2%; } .link_nn_office{ top: 11.6%; left: 66%; width: 18.5%; height: 38.6%; } .link_nn_tourism{ top: 16.2%; left: 21%; width: 14.55%; height: 30.15%; } .link_nn_restaurant{ top: 58.9%; left: 23.6%; width: 14.4%; height: 30.1%; } .link_nn_municipality{ top: 60.3%; left: 71.6%; width: 14.1%; height: 29.4%; } .link_nn_manufacture{ top: 24.1%; left: 39.9%; width: 18.6%; height: 38.9%; } /*************************************** ページ下部　productsformリンク ****************************************/ a.productsForm{ box-sizing: border-box; background-color: #c02; color: #fff; display: block; font-size: 1.0rem; overflow: hidden; padding: 16px 32px; position: relative; text-decoration: none; text-transform: uppercase; z-index: 1; border-radius: 50px; text-align: center; margin: 30px auto; width: 420px; } @media screen and (max-width: 579px){ a.productsForm{ margin: 15px auto 25px; width: 280px; } } a:hover.productsForm{ background-color: #b1000e; } a.productsForm span::before{ background: url(../../image/jp/r1/icon/icon_mail_white_hd.png) no-repeat 50% 50%; background-size: 97%; box-sizing: border-box; content: ""; display: inline-block; height: 25px; padding: 0; margin-right: 5px; width: 25px; vertical-align: middle; } /*************************************** img+TextBox1:3 ****************************************/ .Img1ColumnSet{ display: flex; justify-content: space-around; } @media screen and (max-width: 579px){ .Img1ColumnSet{ flex-wrap: wrap; } } .Img1Column{ width: 320px; } .Text3Column{ width: 720px; } @media screen and (max-width: 579px){ .Img1Column,.Text3Column{ width: 100%; } } .AdjustItemCenter{ align-items: center; } /* -- AttachiTopTriangle --*/ .AttachiTopTriangle{ position: relative; margin-bottom: 55px; } .AttachiTopTriangle::after { content: ""; width: 0; height: 0; border-style: solid; border-width: 30px 30px 0 30px; border-color: #f2f2f2 transparent transparent transparent; display: block; position: absolute; left: 47%; bottom: -45px; } @media screen and (max-width: 579px){ .AttachiTopTriangle::after{ left: 43%; } } /*************************************** 追加調整 ****************************************/ /*FatMenu 文字サイズ調整*/ .FMLinkListStyle { font-size: 90%; } /*テキスト調整*/ .TextModeVertical { writing-mode: vertical-lr; } /* リスト　接頭あり */ ul.ListStyle1.specialty li { text-indent: -4em; padding-left: 4em; background: none; } ul.ListStyle1.specialty .label { font-weight: bold; color: #999; } /* 配置調整 */ .mt-20 { margin-top: -20px !important; } @media screen and (max-width:767px) { .mt-20 { margin-top: unset !important; } } .mb_100 { margin-bottom: 100px !important; } @media screen and (max-width:767px) { .mb_100 { margin-bottom: unset !important; } } .ml_1-5 { margin-left: 1.5rem !important; } .mb_5 { margin-bottom: 5px; } /* ListStyle　スローガン */ .ListStyleSlogan li { font-weight: bold; } .ListStyleSlogan li span{ font-weight: normal; } /* TextIndent style */ .TextIndent1-5 { text-indent: -1.5rem; padding-left: 1.5rem; } /* カラー調整 */ .Red { color: #c00000; } .Blue { color: #0000ff; } /* VerticalLocalNavi　カテゴリ小項目 */ .NoLink { background: #eee; display: block; padding: 9px 15px; } /* AnnotationsStyle1 ListStyle */ .ListStyle2 .AnnotationsStyle1 .arrow { background: none!important; } /* table設定 */ .JS table.TableStyleNarrow th, .JS table.TableStyleNarrow td { padding: 10px 10px; } @media screen and (max-width: 579px) { .JS table.TableNarrowSP th, .JS table.TableNarrowSP td { padding: 10px 5px; } } .Tdwidth10{ width: 10%; } .Tdwidth15{ width: 15%; } .Tdwidth20{ width: 20%; } .Tdwidth25{ width: 25%; } .Tdwidth32{ width: 32%; } .Tdwidth48{ width: 48%; } /* table設定　左に連番がある場合 =========================================================================================== */ .numbered .CenterAdjust:first-child { width: 3rem; padding: unset; } .Column1andHalf .numbered td:nth-child(2) { white-space: nowrap; } /* table内最後のリスト下のマージン削除 =========================================================================================== */ table ul:last-child.ListStyle1 { margin-bottom: 0; } /* sustainability social Pic ---------------------------------------------------------------------------------- */ .MatsuriPicWrap,.HwPicWrap { margin: 0 30px 15px; } .MatsuriPicWide,.MatsuriPicTall,.HwPicWrap { display: flex; } .MatsuriPic.ImgRWD,.HwPic.ImgRWD { margin: 0 0 10px; } .MatsuriPic.ImgRWD img,.HwPic.ImgRWD img { margin: 0 0 5px; width: 100%; } .MatsuriPicWideOdd { margin: 0 10px 0 0; width: 276px; } .MatsuriPicWideEven { width: 384px; } .MatsuriPicTall .MatsuriPic { margin: 0 10px 0 0; } .MatsuriPicTall .MatsuriPic:last-child { margin: 0; } .HwPicWide { margin: 0 10px 20px 0; width: 542px; } @media screen and (max-width: 766px) { /* flexの打消し */ .MatsuriPicWide, .MatsuriPicTall, .HwPicWrap { display: block; } /* 全体的なboxのmarginの打ち消し */ .MatsuriPicWrap, .HwPicWrap, .HwPicWide { margin: 0; } /* 画像関連のサイズ・marginの打消し */ .MatsuriPicWideOdd, .MatsuriPicWideEven, .HwPicWide { margin: 0 auto; max-width: 100%; width: 320px; } /* 中央配置 */ .MatsuriPic.ImgRWD, .HwPic.ImgRWD, .MatsuriPicTall .MatsuriPic:last-child { margin: 0 auto 10px; width: 320px; } }